PWA: Workbox

PWA implementation using Google's Workbox

Using Google's Workbox libraries allows for both high levels of customization and abstraction when it comes to creating our service worker. The below code is taken from the service worker used on HAngry.

importScripts(
  'https://storage.googleapis.com/workbox-cdn/releases/6.1.1/workbox-sw.js'
);

workbox.recipes.pageCache();
workbox.recipes.googleFontsCache();
workbox.recipes.staticResourceCache();
workbox.recipes.imageCache();
workbox.recipes.offlineFallback();

As demonstrated, recipes allow us to abstract away the details of commonly used service worker patterns, while Workbox itself allows room for customization down the line should the need arise.

Useful Links

• Workbox documentation