Skip to content

Web Worker

Spicy — senior dev territoryFrontend

ELI5 — The Vibe Check

JavaScript normally runs on one thread, which means heavy computation freezes your UI. A Web Worker lets you run code in a background thread so your page stays responsive. Need to parse a 50MB JSON file? Do it in a Worker so the user can still click buttons while you crunch numbers.

Real Talk

Web Workers are a browser API that allows JavaScript to run in background threads separate from the main UI thread. Workers cannot access the DOM directly and communicate with the main thread via postMessage. They are used for CPU-intensive tasks like data processing, image manipulation, and encryption to avoid blocking the UI.

Show Me The Code

// worker.js
self.onmessage = ({ data }) => {
  const result = data.reduce((acc, n) => acc + n, 0)
  self.postMessage(result)
}

// main.js
const worker = new Worker('./worker.js')
worker.postMessage([1, 2, 3, 4, 5])
worker.onmessage = ({ data }) => console.log('Sum:', data)

When You'll Hear This

Move the image processing to a Web Worker — it's killing the main thread.,SQLite WASM runs inside a Web Worker in modern browser apps.,Web Workers can't touch the DOM — only communicate via messages.

Made with passive-aggressive love by manoga.digital. Powered by Claude.