About the Book

“I very much enjoyed how this book covers the full Ajax application lifecycle and not only coding techniques. Anyone who is looking to become a professional front-end developer will appreciate the architectural insight and best practices delivered by this book.”  — Andi Gutmans, Co-Founder & Co-Chief Technology Officer of Zend Technologies

 

Mission-Critical Ajax: Maximizing Scalability, Performance, Security, Reliability, and Maintainability

 

Advanced Ajax: Architecture and Best Practices is the definitive guide to building business-critical, production-quality Web applications with Ajax. Shawn M. Lauriat systematically addresses the design, architecture, and development issues associated with Ajax, offering proven patterns and robust code examples available in no other book. You’ll find best practices for addressing the full spectrum of issues enterprise Ajax developers face: scalability, performance, security, reliability, flexibility, maintainability, and reusability.

 

Writing for experienced Web developers, Lauriat delivers fresh ideas and elegant solutions: meaty technical content, presented with exceptional clarity. Among the many topics he covers in unprecedented depth: cleanly implementing JavaScript custom events to reduce coupling and to enhance flexibility; overcoming Ajax’s traditional accessibility limitations; reducing network latency through compression and other techniques; and much more. Coverage includes 

• Planning Ajax interfaces for simplicity, clarity, and intuitiveness
• Creating scalable, maintainable architectures for client-side JavaScript
• Using the latest tools to profile, validate, and debug client-side code
• Architecting the server side for security and functionality, while restricting loaded data, objects, and actions to current requests
• Protecting against the most widespread and significant Ajax security risks
• Optimizing every component of an Ajax application, from server-side scripts to database interactions
• Introducing cutting-edge Ajax: game development, Ajax with canvas, and Ajax for enterprise applications

About the Web Site

This book’s companion Web site (http://advancedajax.frozen-o.com) doesn’t just provide all the code: It shows code examples in action, as building blocks of a real Web application interface.

Table of Contents:
Acknowledgments ......................................................................................................... xiii About the Author ............................................................................................................xv Introduction ............................................................................................... 1 0.1 Ajax, the Acronym .............................................................................. 2     0.1.1 Asynchronous.......................................................................... 3     0.1.2 JavaScript ................................................................................ 3     0.1.3 XML ....................................................................................... 4 0.2 This Book’s Intentions ........................................................................ 5 0.3 Prerequisites for This Book ................................................................. 8 Chapter 1 Usability ................................................................................................11 1.1 Interface Versus Showcase ................................................................. 12     1.1.1 Implementation .................................................................... 14 1.2 User Expectations ............................................................................. 16 1.3 Indicators and Other Forms of User Feedback .................................. 17     1.3.1 The Throbber ........................................................................ 17     1.3.2 Progress Indicators ................................................................ 20     1.3.3 Keeping the User in the Loop ................................................ 22 1.4 Semantic Markup ............................................................................. 30         1.4.1 More Accessible ..................................................................... 30     1.4.2 Easier to Use ......................................................................... 32     1.4.3 Easier to Maintain ................................................................. 33     1.4.4 Easier to Parse ....................................................................... 34 1.5 What CSS and JavaScript Have in Common .................................... 37 Chapter 2 Accessibility ..........................................................................................43 2.1 WCAG and Section 508 ................................................................... 44     2.1.1 WCAG ................................................................................ 45     2.1.2 Section 508 ........................................................................... 51 2.2 Screen Readers Can Handle Ajax ...................................................... 53     2.2.1 Content Replacement ........................................................... 54     2.2.2 Form Validation .................................................................... 55 2.3 Unobtrusive Ajax .............................................................................. 56 2.4 Designing with Accessibility in Mind ................................................ 58     2.4.1 High-Contrast Design ........................................................... 59     2.4.2 Zoomable Interface ............................................................... 60     2.4.3 Easily Targeted Controls ........................................................ 62 2.5 WAI-ARIA ........................................................................................ 63 Chapter 3 Client-Side Application Architecture ....................................................67 3.1 Objects and Event Triggering ............................................................ 68     3.1.1 Native Object Event Handling .............................................. 70     3.1.2 JavaScript Objects ................................................................. 71 3.2 Model-View-Controller Design Pattern ............................................ 87     3.2.1 The Model ............................................................................ 88     3.2.2 The View .............................................................................. 92     3.2.3 The Controller .................................................................... 101 3.3 Event-Driven Application Development ......................................... 104     3.3.1 Advantages of Architecture .................................................. 104 Chapter 4 Debugging Client-Side Code ..............................................................107 4.1 Validation, Validation, Validation .................................................... 108     4.1.1 Markup Validator ................................................................ 109     4.1.2 CSS Validator ...................................................................... 110     4.1.3 Semantic Extractor .............................................................. 111 4.2 Browser Tools and Plugins .............................................................. 111     4.2.1 The Console ........................................................................ 112     4.2.2 Internet Explorer ................................................................. 113     4.2.3 Firefox ................................................................................. 116     4.2.4 Opera .................................................................................. 122     4.2.5 Safari ................................................................................... 124 4.3 JavaScript Profiling ......................................................................... 126     4.3.1 Recognizing Bottlenecks ...................................................... 128 4.4 Unit Testing .................................................................................... 132     4.4.1 Assertions ............................................................................ 134     4.4.2 Test Setup ............................................................................ 135     4.4.3 The Test Itself ...................................................................... 137     4.4.4 Mock Objects ...................................................................... 140     4.4.5 Test Suites ........................................................................... 143 Chapter 5 Performance Optimization ..................................................................145 5.1 Database Performance ..................................................................... 146     5.1.1 Schema ............................................................................... 146     5.1.2 Queries ............................................................................... 150 5.2 Bandwidth and Latency .................................................................. 154     5.2.1 Bandwidth .......................................................................... 154     5.2.2 Latency ............................................................................... 158 5.3 Cache.............................................................................................. 160     5.3.1 Filesystem............................................................................ 161     5.3.2 Memory .............................................................................. 163     5.3.3 Completing the Implementation ......................................... 170 5.4 Taking Advantage of HTTP/1.1 ..................................................... 171     5.4.1 If-Modified-Since ................................................................ 174     5.4.2 Range .................................................................................. 176 5.5 PHP Profiling ................................................................................. 178     5.5.1 Advanced PHP Debugger .................................................... 179     5.5.2 Xdebug ............................................................................... 182 Chapter 6 Scalable, Maintainable Ajax ................................................................187 6.1 General Practices ............................................................................. 188     6.1.1 Processor Usage ................................................................... 188     6.1.2 Memory Usage .................................................................... 191 6.2 A Multitude of Simple Interfaces .................................................... 194     6.2.1 Modularity .......................................................................... 195     6.2.2 Late Loading ....................................................................... 198 6.3 Dense, Rich Interfaces .................................................................... 201         6.3.1 Monolithic Applications ...................................................... 201     6.3.2 Preloading ........................................................................... 204 Chapter 7 Server-Side Application Architecture ..................................................207 7.1 Designing Applications for Multiple Interfaces ............................... 208 7.2 Model-View-Controller Design Pattern .......................................... 212     7.2.1 The Model .......................................................................... 212     7.2.2 The Controller .................................................................... 222     7.2.3 The View ............................................................................ 231 7.3 Using the Factory Pattern with Your Template Engine .................... 237 Chapter 8 Keeping a Web Application Secure ......................................................243 8.1 HTTPS .......................................................................................... 244     8.1.1 Why Use HTTPS? .............................................................. 245     8.1.2 Security Versus Performance ................................................ 247 8.2 SQL Injection ................................................................................. 247     8.2.1 Don’t Use Magic Quotes ..................................................... 248     8.2.2 Filtering .............................................................................. 249     8.2.3 Prepared Statements ............................................................ 251 8.3 XSS ................................................................................................. 252     8.3.1 Escaping for Markup ........................................................... 252     8.3.2 Escaping for URLs .............................................................. 257 8.4 CSRF .............................................................................................. 258     8.4.1 Check the Referer ................................................................ 259     8.4.2 Submit an Additional Header .............................................. 261     8.4.3 Secondary, Random Tokens ................................................. 262 8.5 Don’t Trust the User ........................................................................ 265 8.6 Don’t Trust the Server ..................................................................... 266 Chapter 9 Documenting ......................................................................................271 9.1 Yes, You Need to Document ........................................................... 272     9.1.1 Jog Your Own Memory ....................................................... 272     9.1.2 Lessen the Learning Curve .................................................. 274     9.1.3 Mind That Bus .................................................................... 274 9.2 API Documentation ........................................................................ 275     9.2.1 phpDocumentor ................................................................. 275     9.2.2 JSDoc ................................................................................. 283 9.3 Internal Developer Documentation ................................................ 288     9.3.1 Coding Standards ................................................................ 289     9.3.2 Programming Guides ...................................................... 293     9.3.3 Style Guides .................................................................... 295 Chapter 10 Game Development...........................................................................297 10.1 A Different Kind of Security ...................................................... 299     10.1.1 Validation ..................................................................... 300     10.1.2 Server-Side Logic .......................................................... 302 10.2 Single Player ............................................................................... 304     10.2.1 Double Buffering with Canvas ...................................... 305 10.3 “Real-Time” Multiplayer ............................................................. 310     10.3.1 Streaming Response ...................................................... 310     10.3.2 WHATWG event-source Element ................................ 315     10.3.3 Predictive Animation .................................................... 317 Chapter 11 Conclusions ......................................................................................321 11.1 Remember the Users ................................................................... 322 11.2 Design for the Future .................................................................. 323 11.3 Develop for the Future................................................................ 324 Bibliography ..........................................................................................................325 Appendix A Resources ..........................................................................................329 Appendix A OpenAjax ..........................................................................................333 Conformance ......................................................................................... 334 Namespace Registration ......................................................................... 337 Event Management ................................................................................ 338 Index ......................................................................................................................341