freecoding.school100% FREE · NO SIGNUP
API ArcadeISSUE #11 of 23

service workers · install · activate · fetch

ApiaVSLegacy Larry
Apia saysA service worker is a background proxy script that enables offline and caching.

Registered with navigator.serviceWorker.register("sw.js"), it runs on its own thread between your page and the network. It listens for install, activate, and fetch — intercepting requests to serve cached responses, enabling offline and instant loads. Requires HTTPS and a separate file; it's the core of PWAs (with push and background sync).

Power-ups you unlock

Legacy Larry attacks — common mistakes

Boss battleSketch registering a service worker and a cache-first fetch handler.

Example code

<!doctype html><html><head><meta charset="utf-8"></head>
<body style="background:#06040d;color:#e6e0ff;font-family:monospace;padding:20px"><pre>// page:
navigator.serviceWorker.register('/sw.js');
// sw.js:
self.addEventListener('fetch', e =>
  e.respondWith(caches.match(e.request).then(r => r || fetch(e.request))));</pre></body></html>
▶ Open the interactive comic issue
‹ File Api · File · Blob · FileReaderCache Api · Putting Responses In Cache ›