How to resolve Dynamic URLs dependencies through Service worker?

Question

Though I am familiar with Sw-precache and Sw-toolbox libraries, Still puzzle on how to cater Dynamic Dependencies while building Progressive Web App using Angular.

I have pre-cached bundle.js, bundle.css and some static templates for my application using Sw-precache build process. (Assume all my templates (.html files) are dependent on bundle.js and bundle.css)

1. What if I update my template which is not pre-cached ? How do I ensure Updation of bundle.js/css in conjunction with my template.

2. What if I update my template which is already pre-cached. Does it always update in conjunction with pre-cached bundle.js/css files.

3. Last use case, When my template is already pre-cached but it has some inline script with src attribute and this script file is not cached anywhere. Assume I made some changes in template as well as script file. What caching approach should I follow to ensure Updation of template file in conjunction with script file.

We are not following pure App-shell architecture, It's like Single Page App designed using Angular.js

Answer 1

Sw-Precache will update for the file changes, generate a new service worker and when you deploy updates to bundle js or css, you should be deploying your new Sw-Precache generated service worker as well.

Answer 2

Just as a general idea, hash all the resources you're precaching and the perform a hash of hashes and include this digest in the service worker so when one of the dependencies change, the digest will change and your service worker will update triggering a new installation event. Does it make sense?