HTML5 Hacks

Chapter 9. Hacking HTML5 Connectivity

The HTML5 connectivity layer is made up of perhaps the most exciting of the specifications in the HTML5 family. In this group are XHR2, the WebSocket Protocol, the Server-Sent Events feature and EventSource JavaScript API, and SPDY. Many would agree these technologies are already disrupting web application design in much the same way Ajax did in the mid-2000s.

These technologies and protocols make up the next evolution in client/server web technology.

The WebSocket Protocol creates a single, persistent TCP socket connection between a client and a server, allowing for bidirectional, full-duplex messages to be distributed without the overhead of HTTP headers and cookies. This long-awaited technology provides a solution that was formerly created through creative uses of HTTP.

Over the past decade, web application developers have crafted technologies and techniques such as Ajax, Comet, Flash sockets, HTTP streaming, BOSH, and Reverse HTTP to achieve solutions that provided real-time UI updates. In the section Polyfill WebSocket Support with Socket.IO and in [Hack #76], we will rehash some of those techniques as we set up a Node.js socket server that provides fallbacks for browsers that have yet to implement the WebSocket specification. While we are at it, we will also inspect the network and peer deeper into the connectivity layer by exploring the command-line interface of the ws module for Node.js in [Hack #71], and by using the Chrome Developer ...