Summary
Web Workers — parallel JS threads, no DOM, message-passing for CPU-heavy work (parsing, crypto). Service Workers — network proxy, cache, push, offline — lifecycle separate from page, scope by path. Workers terminate when idle; SW persists and updates via install/activate. Wrong tool: SW for pure computation; Worker for intercepting fetch without page control.
Code example
// Web Worker — CPU work off main thread
const worker = new Worker('/hash-worker.js');
worker.postMessage(largeBuffer);
worker.onmessage = (e) => console.log('hash:', e.data);
// Service Worker — network proxy (separate file)
navigator.serviceWorker.register('/sw.js');
Key points
- Web Workers — parallel JS threads, no DOM, message-passing for CPU-heavy work (parsing, crypto).
- Service Workers — network proxy, cache, push, offline — lifecycle separate from page, scope by path.
- Workers terminate when idle; SW persists and updates via install/activate.
- Wrong tool: SW for pure computation; Worker for intercepting fetch without page control.