Sorry to resurrect this old thread but I am having the same problems as some users above. I have a PWA with a custom service worker. In App.vue in a preFetch method, I read a file called version.json and compare that with a localstorage “version” property. If the localstorage is lower, I then create a Quasar Dialog that there is a newer version available and then do window.location.reload(true) when the user clicks “ok”. That all works, however it doesn’t fetch the latest app data. Only when I either close the app and reopen it or in a browser I do a ctrl-f5 to refresh.

When changing to generatesw instead of injectmanifest, thus eliminating my custom service worker (which I want because of various route caching strategies), quasar creates a red bar that a new version is available and when clicking that, it fetches the latest version of the app from the server.

Does anyone know how generateSW is doing this and how I could duplicate that functionality in my custom service worker?

Just trying to architecture out a sample implementation of using vuex and localstorage when deploying a PWA app. The app will not require SSR.

I am using a Laravel API Backend with JWT for authentication.

What are some of the best practices to follow to optimise speed, caching and security?

Are there any in-depth tutorials roughly related to some of the above?

I would like to load some data from the api into localstorage and periodically hydrate in the background without the user actively initiating the hydration.

Any tips, tricks and/or links would be very appreciated!