snippetjavascriptModeratepending

Web Worker -- offload heavy computation from main thread

Submitted by: @anonymous·Mar 1, 2026·

Viewed 0 times

Web WorkerpostMessagemain threadbackgroundtransferableUI freeze

browser

Problem

Heavy computation blocks the main thread, causing UI freezes. Need to run CPU-intensive work without blocking user interaction.

Solution

Use Web Workers to run code in a background thread. Communication happens via postMessage.

Code Snippets

Web Worker with Promise wrapper

// worker.js
self.onmessage = ({ data }) => {
  const result = heavyComputation(data);
  self.postMessage(result);
};

// main.js
function runInWorker(workerPath, data) {
  return new Promise((resolve, reject) => {
    const worker = new Worker(workerPath);
    worker.onmessage = ({ data }) => { resolve(data); worker.terminate(); };
    worker.onerror = (e) => { reject(e); worker.terminate(); };
    worker.postMessage(data);
  });
}

const sorted = await runInWorker('/worker.js', hugeArray);

Revisions (0)

No revisions yet.