JavaScript: The Definitive Guide, 6th Edition

Application Storage and Offline Webapps

HTML5 adds an “application cache” that web applications can use to store themselves locally in a user’s browser. localStorage and sessionStorage store data for a web application, but the application cache stores the application itself—all the files (HTML, CSS, JavaScript, images, and so on) the application needs to run. The application cache is different from a web browser’s regular cache: it isn’t cleared when the user clears the regular cache. And cached applications aren’t cleared out on a LRU (least-recently used) basis as they might be in an ordinary fixed-size cache. Applications aren’t temporarily stored in the cache: they’re installed there, and they remain there until they uninstall themselves or the user deletes them. The application cache is really not a cache at all: a better name would be “application storage.”

The reason to allow web applications to be locally installed is to guarantee their availability when offline (such as when on an airplane or when a cellphone isn’t receiving a signal). Web applications that work while offline install themselves in the application cache, use localStorage to store their data, and have a synchronization mechanism to transfer stored data to the server when they go back online. We’ll see an example offline webapp in Offline Web Applications. First, however, we’ll see how an application can install itself in the application cache.

The Application Cache Manifest

In order to install an application ...