How to remove old service worker?
Dec 22, 2022
Let us learn how to remove old service worker
My new personal site was built from scratch where I focused more on the design and migrating the contents from the old to new one.
All set, so hosted the site on Vercel and modified the DNS settings to map the domain
To my surprise, I was still seeing the old one. After scratching my head a bit then figured out I completely forgot to handle the service worker. The service worker cached my old site and served it as it should be but unfortunately not for my case.
If you are someone like me, here is the solution for you that worked for me.
Replace everything about your previous ServiceWorker with the following code
Just, Deploy your project! 🎉
How it works?
This code will listen for two major events,
- Install Event which is fired when
ServiceWorkerRegistrationacquires a new worker. When fired, we are forcing the waiting service worker to become an active service worker.
- Activate Event which is fired when the service worker becomes the active worker for a page. When the activate event is fired, the service worker will unregister itself using the
Caveat New service worker will get enabled only for the newly opened tabs and not the existing ones. If there are any existing open tabs, then they will still reflect old content.