loading...

Help: Should a new service worker force a refresh to update a PWA?

mike_hasarms profile image Mike Healy ・1 min read

I have a frontend app called Finskore for scoring games of Finska that I want to enable offline.

I'm following Google's PWA guide about service workers and it seems that an updated service worker will only take effect on the following visit. The existing SW runs the current session, but the new version is installed for the next network visit.

My question is, should I try and detect when a new service worker has been installed and force a refresh at that time? The reason being to get the new version of the app for the immediate session.

I was wondering if I could compare cache version names on install and do a window.reload() if they are different?

Thoughts?

Posted on by:

mike_hasarms profile

Mike Healy

@mike_hasarms

Hey, I'm a contract web developer with a particular interest in Laravel & Vue web apps. Also working on my side project "HadCoffee".

Discussion

markdown guide
 

No. Absolutely not. You should never force reload an application of any kind without the user asking for it. Instead, just show a non-obstructing notification saying something like β€œA new version is available. Reload to enable it.”.

 

Fair enough. I guess I still need to know how to detect a new version of the app in order to show that message.

As it turned out I couldn't actually get my app to work offline in Chrome anyway 😐

 

It's actually easy. You can add an event listeners inside your service worker that listens for the install event. Whenever it fires, send a message via postmessage to your main thread and show a update info to your users.
When users presses ok send another message to the service worker back that triggers a "self.skipWaiting()" and afterwards a location.reload()