A service worker is like a cookie. Cookies are downloaded from a web server and installed in a browser. […] A service worker script is much more powerful. It contains a set of instructions that the browser will consult before making any requests to the site that originally installed the service worker.
A service worker is like a virus. When you visit a website, a service worker is surreptitiously installed in the background. Afterwards, whenever you make a request to that website, your request will be intercepted by the service worker first. […]
A service worker is like a toolbox. By itself, a service worker can’t do much. But it allows you to access some very powerful browser features, like the Fetch API, the Cache API, and even notifications. […]
Going Offline (cache)
I have been playing with Service Workers for a long time with a couple of unresolved issues still refraining me from pushing it to production. With a current support of almost 75% and a potential professional usage, it is time to try something real on my lab for these last 14 years and counting: this place.
It only applied to recent pages and put (cache) links into… cache. It means that if you loaded an article and go offline, you will still be able to read cached versions of external links. I also put previous/next links so you have close articles to read too. It looks to be a good trade-off to me given the few extra kilobytes fetched that way. I limited the cache to 25 elements for now, let me know if it hurts your bandwidth.
It started as a 30 minutes experiment and ended up 8 hours later with a rather unstable implementation. Not bad. My main gripe was to actually be able to clear the cache at each and every levels when testing. Such a nightmare, browsers need a new refresh really everything keyboard shortcut to ease our attempts to break the refresh button. Please.
The hardest technical part was to be able to communicate between the current page and the service worker to select dynamically which links I want to put in cache. And back to current page, to display some valuable feedback to you when links are in cache. I hope it makes sense given the time I spent on it :-D.
There are surely a few gotchas here and there, please report any inconsistent situation by email…
I should write an article about that. French or English?