DEV Community

Dmitri Pisarev 🇷🇺
Dmitri Pisarev 🇷🇺

Posted on

Getting a PWA to self-update

So people have asked me to share how to make sure your PWA automatically updates itself, even on #iOS 12 (which preserves the state of your app even when quitting it).

In my case the app is stateless so I can allow myself to just reload the app without showing any prompts for update to the user. If your app is more complex you can show a prompt in every place I do location.reload, all other things should be relevant.

Here's the point to listen if the new ServiceWorker is available:

When installing SW I do skipWaiting to make it take control immediately, without waiting for all tabs to be closed. Also I do clients.claim in order to take control of all the tabs that have no SW installed yet for some reason:

On every route transition I compare the current app's version with the version returned by app's version endpoint:
If the versions differ I reload. This is especially important on iOS 12 where there's no way to make the app to reload from user actions.

On every deploy I tag a new version with yarn version --patch. Here's how I expose it server-side:

I also display the version in the app, quite helpful when debugging:

That's it! On every route transition I can be sure that the users have the latest version of the app.

Make sure you also read this related post how to deploy an app with code-splitting, or else you won't get very far with auto-updates!

Top comments (0)