O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

HTML5 and JavaScript Web Apps

Book Description

This hands-on book looks past the hype and buzzwords surrounding HTML5 and gives you a conservative and practical approach to using HTML5, JavaScript MVC frameworks, and the latest W3C specifications. You’ll quickly master how to build mobile and desktop web apps that are widely supported across all major web browsers and devices.

Even though Web Storage, Web Workers, Geolocation, Device Orientation, and WebSockets have been covered many times in the past, it is often from a very high or basic level. This book goes into the trenches to review actual use cases for each of these APIs and gives real-world examples on how to use each one. If you're familiar with JavaScript, CSS and HTML basics and are ready to start piecing together the architecture of HTML5, then this book is for you.

  • Assemble a coherent architectural whole from HTML5’s complex collection of parts
  • Gain a clear understanding of client-side architecture and the "mobile first" approach
  • Design, create, and tune eye-catching and robust mobile web apps
  • Explore how the top five JavaScript MVC frameworks interact with the server
  • Learn best practices for setting up a raw WebSocket server
  • Examine how sites such as Google, Twitter, and Amazon store data on the client
  • Use real-world methods for applying geolocation, and learn the pitfalls of various implementations
  • Process images and other data in the background with Web Workers

Table of Contents

  1. Preface
    1. Who This Book Is For
    2. Who This Book Is Not For
    3. What You’ll Learn
    4. About the Code
    5. Conventions Used in This Book
    6. Using Code Examples
    7. Safari® Books Online
    8. How to Contact Us
    9. Acknowledgments
  2. 1. Client-Side Architecture
    1. Before HTML5
    2. More Code on the Client
    3. The Browser as a Platform
    4. Conclusion
  3. 2. The Mobile Web
    1. Mobile First
    2. Deciding What to Support
      1. Mobile Web Browsers
        1. WebKit
          1. Mobile Safari (iOS6)
          2. Android
        2. Mobile Firefox
        3. Opera Mobile
        4. Internet Explorer Mobile
    3. Mobile Browser Market Share
    4. Browser Grading
    5. HTML5 in the Enterprise
      1. Graceful Degradation
    6. QA and Device Testing
  4. 3. Building for the Mobile Web
    1. Mobile Web Look and Feel
      1. The Look
      2. The Feel
        1. Hardware acceleration
    2. Interactions and Transitions
      1. Sliding
      2. Flipping
      3. Rotating
      4. Debugging Hardware Acceleration
        1. Using Safari
        2. Using Chrome
      5. Memory Consumption
    3. Fetching and Caching
    4. Network Type Detection and Handling
    5. Frameworks and Approaches
      1. Single Page
        1. jQuery Mobile
        2. jQTouch
      2. No Page Structure
        1. xui
      3. 100% JavaScript Driven
        1. Sencha Touch
        2. Wink Toolkit
        3. The-M-Project
      4. Mobile Debugging
        1. weinre
        2. Adobe Shadow
        3. Opera Remote Debugging
  5. 4. The Desktop Web
    1. The Browser as a Platform
      1. Client Versus Server HTML Generation
    2. Device and Feature Detection
      1. Client-Side Feature Detection
      2. Client-Side userAgent Detection
      3. Server-Side userAgent Detection
    3. Compression
      1. GZIP Versus DEFLATE
      2. Minification
        1. Bringing it all together
    4. JavaScript MVC Frameworks and the Server
      1. The Top Five Frameworks
      2. Backbone
        1. Backbone server synchronization
        2. Backbone and legacy servers
      3. Ember
        1. Ember server synchronization
      4. Angular
        1.  
          1. Angular server synchronization
      5. Batman
        1.  
          1. Batman server synchronization
      6. Knockout
        1.  
          1. Knockout server synchronization
  6. 5. WebSockets
    1. Building the Stack
      1. On the Server, Behind the Scenes
    2. Programming Models
      1. Relaying Events from the Server to the Browser
        1. Using the new and shiny
      2. Binary Data Over WebSockets
      3. Managing Proxies
        1. Building your own
      4. Frameworks
        1. Vert.x
        2. Socket.IO
        3. Atmosphere
  7. 6. Optimizing with Web Storage
    1. The Storage API
    2. The StorageEvent API
      1. What’s Racy and What’s Not?
    3. Using JSON to Encode and Decode
    4. Security and Private Browsing
      1. Security
      2. Private Browsing
    5. Who’s Using Web Storage?
      1. Using Web Storage Today
        1. Enable automatic sign-in
        2. Caching with a timestamp
    6. Syncing Data from the Client Side
      1. Database Syncing with Backbone
    7. Using Web Storage in Any Browser
    8. Frameworks
      1. LawnChair
      2. persistence.js
  8. 7. Geolocation
    1. A Practical Use Case: User Tracking
    2. A Practical Use Case: Reverse Geocoding
    3. Frameworks
      1. geo-location-javascript
      2. Webshims lib
  9. 8. Device Orientation API
    1. A Practical Use Case: Scrolling with Device Movement
  10. 9. Web Workers
    1. A Practical Use Case: Pooling and Parallelizing Jobs
      1. Other Uses
  11. Index
  12. About the Author
  13. Colophon
  14. Copyright