App cache & localStorage survey

In preparation for my talk at HTML5 Dev Conf I surveyed the Alexa US Top 10 websites to see which ones use app cache and localStorage. I mostly focus on mobile these days so it’s natural to think I ran these tests from a mobile browser, which I did. But I also tested with a desktop browser.

Some people might ask, Why a desktop browser?

To which I would reply, Why not a desktop browser?

I blogged previously about how Google and Bing use localStorage on mobile devices. It’s a powerful performance technique. They break up their JavaScript and CSS into smaller blocks and save them in localStorage. Simultaneously they set a cookie so that the server knows not to send that payload on subsequent searches, a savings of 150-170 kB before gzipping.

In the comments on that post Simon asked:

I’m curious why the techniques with LocalStorage are used for the mobile versions of the search sites but not for the standard desktop versions – I would think that this technique would work well [on] all clients, no?

I agree – this and other HTML5 web storage techniques make sense for the desktop, too. There are some reasons why we’re seeing these used first on mobile:

Mobile latencies are higher and connection speeds are lower, so clientside caching is more important on mobile.

Mobile disk cache sizes are smaller than desktop sizes, so a better alternative is needed for mobile.

There are still desktop browsers with significant market share that are missing many HTML5 capabilities, whereas mobile browsers have more support for HTML5.

Even though the motivation for app cache and localStorage are stronger for mobile, they should also be used when the website is accessed from a desktop browser. I did a quick survey to see which of the top 10 websites were using app cache or localStorage on either mobile or desktop. Here are the results:

Website Mobile Desktop app cache localStorage app cache localStorage Google Search no yes no yes [1] Bing no yes no no Facebook no yes no no Yahoo! Front Page no yes [2] no no YouTube no yes no no Amazon no no no yes [3] Twitter yes yes no yes LinkedIn no no no no eBay no no no no MSN.com no no no no [1] Google Search on the desktop uses sessionStorage, not localStorage.

[2] Yahoo! Front Page only stores two numbers.

[3] Amazon on the desktop only stores a ~30 character string.

Ignoring the small uses of localStorage, 5 of these top 10 websites use localStorage on mobile, but only 2 out of 10 use localStorage (or sessionStorage) on desktop. None of them use app cache, either on mobile or desktop except for Twitter on mobile. I’m surprised no one is using app cache. It’s not appropriate for all applications, such as search, but I would enjoy catching up on Twitter, Facebook, and LinkedIn on the plane – potentially from my laptop in addition to my mobile device. App cache not only brings this offline capability, but provides better caching than the browser’s disk cache.

I’ll repeat this survey in a few months to track the progress. I expect we’ll see the use of localStorage and app cache increase, and for desktop to catch up to mobile.