I want to develop an offline capable progressive web application.
Looking into an example of such an app - airhorner I find that it uses specific version of the application to make sure correct version is loaded.
https://github.com/GoogleChromeLabs/airhorn/blob/main/app/sw.js#L21
However what happens with older version? Do I need to cleanup it? My app is rather large because it contains lots of data (html+js ~1.5MB) and from what I read on iOS there is limit of 50MB of cache per app.
So I wonder if I need to make sure I remove cache of older versions or I can just assume it is cache and it will be removed because it is too old?
if I do need to remove older version, where is the correct place to call it?
I see in https://stackoverflow.com/a/45468998/66522 that it is called for activate event. Can I just add another event listener on this event in addition to this one? https://github.com/GoogleChromeLabs/airhorn/blob/main/app/sw.js#L40
A cache is volatile. The browser may choose to delete everything, or nothing, at any given time. (Ref: Deleting cache)
That being said, it's common practice to clean up after yourself. This becomes especially important when you have a limitation on 50Mb; You don't want the browser to automatically clear a valid cache.
You should do any kind of cleanup in the activate event, so that any old and active ServiceWorkers will still be able to function until the new ServiceWorker has claimed all clients (Become active).
Here's an example of how to manage cache in a ServiceWorker.