Enhancing Web Development with Browser Add-ins and Toolbars for Presentation Tier Optimization
Table of Contents
- Browser Add-ins and Toolbars Supporting Development of the Presentation Tier
- Add-ins and Toolbars
Browser Add-ins and Toolbars Supporting Development of the Presentation Tier
Background and Problem
Significant framework changes in last two years
jQuery and plug-in development combined with Ajax. Frameworks have improved in the past couple of years for Web Development which increases the complexity of the presentation tier.
Rendered HTML may diverge from presentation to user
Themed plug-ins and intermediate page states manipulate the DOM. Polling would update underlying HTML.
Industry best practices requires improved separation of markup from presentation.
Application or UI limits on testing
Validators (client XSS rules) or CSRF checks limit classic review strategies.
Scope
Three add-ins and one toolbar
Tamper Data - View and manipulate HTTP requests
Web Developer - Inspect page update user state
Firebug - Object introspection and debugging
MSIE Debugger - Firebug for MSIE
Productivity tools, build tools, IDEs, etc. not discussed
Google: "firefox add-ins"
Context
When talking about each of the tools some effort will be made to discuss the following:
When Used: SDLC
Development, integration, maintenance, testing, debugging.
Why Used: Tensions
Performance (PLT), security (CSRF), best practices (Progressive Enhancement, Graceful Degradation), product delivery, UI/UX/product requirements.
What Benefits: External
Add-ins and Toolbars
Tamper Data (Jason)
Replaces: Proxy log or accesslog
Scenario: Form support and data or load activity
Manipulate form submission for neighborhood:
Scenario: Monitor web bugs or Ajax calls
Web Developer (Jason)
Replaces: Test JSP updates
When: Development, review
Show: Disable cookies
Show: Consolidated styles
Scenario: Find source of cascaded styles
Scenario: Debug forms
Show: Simplify session clearing
Goal: UI requirements
Firebug: HTML (Jason)
Replaces: View source
When: All
Show: Inline manipulation of content
Goal: Progressive enhancement
Firebug: Console (Jason)
Replaces: Test JavaScript updates
When: All
Show: jQuery manipulation
Scenario: In-place binding of plug-ins
Firebug: DOM (Jason)