HTML and CSS Reference
1.3.7. Offline web applications
These days, it seems we're permanently online—our internet connections are always on,
our mobile devices have data plans that work over cellular data networks, and now we can
even get connected as we travel by air. That said, we may still have times when we need to
make do with working offline. Maybe your network connection is down, or you're abroad
and don't want to pay exorbitant data roaming fees. Or you're using one of the few devices
that doesn't have a wireless data connection. Solutions have long existed for saving HTML
documents for offline use. As useful as these are for reading static content like news art-
icles, they're useless when it comes to web applications. HTML5 goes a step beyond saving
documents, by providing developers the ability to define a cache manifest file that defines
how their applications' files should be cached for offline use.
The cache manifest file can also define those files that shouldn't be cached for offline use.
In this case, a fallback can be provided that will be loaded by the browser when the user is
offline. This enables you to provide separate files for online and offline use.
An example use case might be where your application saves data to a database on a server.
When online, the application may perform AJAX requests to retrieve and update data on
this database. In the background, the application may be storing data locally in an In-
dexedDB database, which we'll talk more about in an upcoming section. Now, when the
offline mode. Instead of firing AJAX requests to the server, it would retrieve and modify
the data in the local IndexedDB database. The next time the user connects to the network,
the application can then submit the data from the local database to the server-side database.
You'll learn how to develop the offline-capable web application shown in figure 1.14 in