Web Sockets

They’ll knock your sock-ets off.

We’ve progressed a lot since the days of dialup and 56k. But while our bandwidth may have gotten larger, our patience with websites and web processes has shrunk. Most people don’t really want to wait around all day for a page to load. Watching a spinning wheel is only so exciting.

Today, many websites rely on a host of technologies to create the feeling of seamless real-time interaction. Popular methods include AJAX, various javascript frameworks, and, as of more recently, web sockets.

AJAX stands for Asynchronous Javascript And XML, and is not its own language, but rather a group of technologies working together in between the client and the server. Together, they facilitate changes and adjustments to the browser window without the need for a full-on HTTP request with every click. Using AJAX can help create that real-time feeling, and allows for a much more responsive user interface.

In order for AJAX to be so responsive, it has to be open and ready for changes to data almost constantly. One way that this is achieved is through polling, where an interval is set (10 or 30 seconds, for example), and the browser sends a request to the server at that interval, checking for updates. Think of it like a kid in the back of the car asking “are we there yet?” over and over. It might be a little annoying, but it gets the job done, more or less.

The issue with polling is that it relies on a set interval, and if changes happen in between, the browser will lag. Granted 10–30 seconds is not all that long, but it takes away from the seamlessness of the experience. More important than that however, is the fact that the server is being badgered constantly. One user on a site making requests every 10 seconds is not that big a deal, but multiply that by thousands for a more popular domain, and you can see how this can get out of hand. Furthermore, polling requires the repeated transfer of cookies and other extra data, much of which is irrelevant to the clients request, and that may slow down the connection.

This is where the newest technology for interaction comes in: web sockets. Web sockets allow for the opening of a continuous channel between the server and the browser until one side severs the connection. This way, instead of constant requests back and forth, messages and data can flow uninterrupted in both directions, creating a truly interactive experience. This is ideal for messaging or other apps that rely on constantly updated data.

WebSocket connections are established during the initial HTTP “handshake”, assuming the client has indicated as such. Once established, the connection moves from the HTTP protocol to a bi-directional protocol. Data is passed through this connection in messages made up of frames. Each frame contains a few bytes of data about its contents, in order to help reconstruct the data on the other end. This system reduces the amount of unnecessary data that gets sent across, an issue prevalent when using AJAX polling strategies.

It is important to note that older browsers may not support WebSockets, so when choosing to use them in your application, be aware that compatibility issues can arise. Other than that, kick off your shoes and put on your sock-ets! An awesomely interactive site is just a few steps away.

Resources