Skip to content
HTML5

Web Workers

Run heavy computation on a background thread.

#web-workers#concurrency

Code

html5
// main.js
const worker = new Worker("worker.js");

worker.postMessage({ cmd: "sum", nums: [1, 2, 3, 4] });

worker.onmessage = e => {
  console.log("Result:", e.data);
};

worker.onerror = e => console.error("Worker error:", e.message);

// worker.js
self.onmessage = function (e) {
  const { cmd, nums } = e.data;
  if (cmd === "sum") {
    const total = nums.reduce((a, b) => a + b, 0);
    self.postMessage(total);
  }
};

// Workers cannot access the DOM, but can use fetch,
// setTimeout, and importScripts("lib.js")