Service Workers & Offline

A programmable proxy between the page and the network: install, activate, fetch, update — plus offline mutation queues and the conflict resolution they imply.

The Service Worker Lifecycle
▶ lab

Install, activate, fetch, update — and the waiting worker that quietly leaves users running last week's code for days.

Q · I deployed a fix an hour ago and users are still hitting the old bug — what version of my site is actually running in their browser?
Intercepting Fetch
▶ lab

The worker sits between the page and the network and can answer from cache, from the network, or with a response it invents — which is exactly why it can brick your site.

Q · Once a service worker controls my page, what actually happens to a request — and what happens if my handler is wrong?
Caching Strategies
▶ lab

Cache-first, network-first, stale-while-revalidate, cache-only, network-only: five answers, each right for something and each with a characteristic way of going wrong.

Q · For this particular request, should the cache or the network answer first — and what does the user get when the answer is wrong?
Offline UX
▶ lab

Honesty is the whole lesson: say what is available, what is stale, what is queued, and what will happen on reconnect — because a UI that pretends to be online is worse than one that admits it is not.

Q · The network is gone or unreliable — what does the interface owe the person using it?
The Offline Mutation Queue
▶ lab

Change offline, persist locally, reconnect, sync, resolve conflicts — and the last step is a product decision, not a technical default.

Q · A user changed something with no network. Where does that change live, in what order does it reach the server, and who decides what happens when the server disagrees?
Manifest and Installability
▶ lab

What the manifest declares, what makes a site installable, and why an installed app with no offline story is just a bookmark with an icon.

Q · What does it take for a site to be installable, and what does installing it actually change for the user?