Mozilla's getting a new look. What do you think? https://mzl.la/brandsurvey

Network independent

Modern web apps can work when the network is unreliable, or even non-existent. No more blank connectivity error pages or dinosaurs running through the desert. A clear separation between UI and content in addition to offline caches and service workers allow you to store the application's data and core assets for future use.

The basic ideas behind network independence are to be able to:

  • Revisit a site and get its contents even if no network is available.
  • Browse any kind of content the user has previously visited at least once, even under situations of poor connectivity.
  • Control what is shown to the user in situations where there is no connectivity.

Core guides

Using service workers
A simple guide for those new to the Service Worker API.
Using IndexedDB
The basics of IndexedDB, explained in detail.
Using the Web Storage API
The Web storage API made simple.
Instant Loading Web Apps with An Application Shell Architecture
A guide to using the App Shell coding pattern to create apps that load quickly.

Technologies

Technology Description Support summary Latest spec
Service workers JavaScript running in a special worker context that is run by the browser under certain circumstances such as fetch or push events. These allow the service worker to intercept responses and customise them in any way you want, for example caching assets for offline use before they are served. Experimental: Chrome and Firefox (more detail) Service Workers
IndexedDB A transactional database system that allows complex client-side data storage to be controlled via JavaScript. Widespread across modern browsers (more detail) Indexed Database API
Web Storage A simple API for storing name-value pairs on the client-side. Widespread (more detail) Web Storage (Second edition)

Tools

localForage
A nice simple JavaScript library for making client-side data storage really simple; it uses IndexedDB by default, and falls back to Web SQL/Web Storage if necessary.
ServiceWorkerWare
An Express-like microframework for easy Service Worker development.
oghliner
Not only a template but a tool for deploying Offline Web Apps to GitHub Pages.
sw-precache
A node module to generate service worker code that will precache specific resources.
upup
A tiny script that makes sure your site is always there for your users.

See also

The service worker cookbook
A series of excellent service worker recipes, showing how to implement an offline app, but also much more.

Document Tags and Contributors

 Contributors to this page: chrisdavidmills
 Last updated by: chrisdavidmills,