Pwa Workbox Cache Static HTML
This site uses the workbox package to manage a service worker which is needed for the site to meet the criterion of a Progressive Web App
I only really did this as practice - it’s not really needed for a static website.
Today I reviewed my setup and fine tuned it.
Workbox offers a couple of modes - I use a simple command
workbox generateSW ./workbox-config.js
This drops into my build script and
- creates a manifest with a hash for each file that gets cached
- includes dynamically created files
- uses the Cache First Policy
Pros
It’s really simple and I don’t have to write a custom Service Worker
It just caches stylesheets and the icons needed by a PWA.
Cons
You don’t have much control - the only caching policy is “Cache First” which works fine for dependent assets which can be fingerprinted and will be refreshed if a new version is needed.
It doesn’t work for HTML which contains the references - as there is nothing to trigger an update.
Summary
Workbox can generate a minimal service worker - but it really is minimal.
There isn’t much you can do with it - and caching static HTML is probably a bad idea as it will never update.
If you want a more subtle caching policy you need to create your own service worker and perhaps use workbox injectManifest merge this manifest with files generated by previous build steps.