JavaScript Libraries for Progressive Web Apps
  • Offline Icon Offline Caching
  • Offline Analytics Icon Offline Analytics
  • Background Sync Icon Background Sync

Get Started

Choose your build tool to get started:

Not using a build tool?

Install our command-line interface:

$ npm install workbox-cli --global

# Generate a service worker with some smart defaults
$ workbox-cli generate:sw

Want to work directly in your service worker?

We support that too with workbox-sw.

$ npm install --save workbox-sw

Then reference the file from your service worker:

importScripts('/node_modules/workbox-sw/build/workbox-sw.vX.X.X.prod.js');

Features

Easy precaching

importScripts('/node_modules/workbox-sw/build/workbox-sw.vX.X.X.prod.js');

const workboxSW = new WorkboxSW();
workboxSW.precache([
  {
    url: '/index.html',
    revision: 'bb121c',
  }, {
    url: '/styles/main.css',
    revision: 'acd123',
  }, {
    url: '/scripts/main.js',
    revision: 'a32caa',
  }
]);

Powerful debugging support

Example of Workbox Logging.

Comprehensive caching strategies

const workboxSW = new WorkboxSW();
const networkFirst = workboxSW.strategies.networkFirst();
workboxSW.router.registerRoute('/schedule', networkFirst);
  • Cache only
  • Network only
  • Cache first, falling back to network
  • Network first, falling back to cache
  • Cache, with network update

The next version of sw-precache & sw-toolbox

Workbox is a rethink of our previous service worker libraries with a focus on modularity. It aims to reduce friction with a unified interface, while keeping the overall library size small. Same great features, easier to use and cross-browser compatible.