Learn About the Service Worker

[alexclst]

The web app uses a Service Worker to enable offline usage of the calculator. However, we’ve seen this result in a permanently white screen on load every now and then. Browsers, at least Safari, on both desktop and mobile give no way to kill off the Service Worker. There is no “hard reload” that loads fresh from the server, the only way a normal person could recover. But there aren’t even any dev tools to speak of that let us kill the Service Worker when it goes bad.

We have learned that a server-side workaround to kill the Service Worker is to temporarily put the following in service-worker.js:

// see https://blog.hackages.io/migrating-a-service-worker-from-an-old-domain-to-your-new-domain-69236418051c

self.addEventListener('install', () => self.skipWaiting());

self.addEventListener('activate', () => {
  self.registration.unregister();
});

But this isn’t a fix that any normal person can use. It is really a brute-force way to get unstuck for us developers, and not a fix at all.

So, the question is, do we remove the Service Worker entirely? The old calculator had used a different mechanism to enable offline use, which never died on us this badly. We may want to seriously consider switching to it for this calculator.

[alexclst]

Since the Service Worker is required on Android, and the recommended route on iOS, really we need to just make sure that we learn as much as we can about the Service Worker. Particularly, is there a better way to handle deployment that would alleviate this issue?