+Let's start with the precache of some files. This is usually done manually by the developer in the `install` event, and usually the resource that are cached are the ones needed in order to have the PWA work offline. In my cases, and generally speaking for a blog/news website, this basically means save in the cache JavaScript and CSS files. Workbox give us the `precacheAndRoute` function to do this. It is possible to pass to this function a list of files to be cached and it will take care of creating an ad-hoc cache and same the files during the installation process. To build this website I'm using Webpack as JavaScript bundler. Workbox has a great support for it. In particular for the precache phase, there is the npm package `workbox-webpack-plugin` that contains a plugin called `InjectManifest`. This plugin is able to inject in the Service Worker code a variable named `__WB_MANIFEST` that contains a list of the entry points/generated files of the Webpack bundling process. So in my service worker I can precache the files I need by just writing `precacheAndRoute(self.__WB_MANIFEST)`. Anyway there's a problem: I want to cache some additional files during the installation process to manage errors related to content not available in the caches that it is not possible to load due to network errors. In this case it is possible to add the additional files with the standard way in the `install` event.
0 commit comments