⌘Ctrlk

IT PT Tools Github

Web workers

Main thread sends a message → worker.postMessage() in main.js
Worker receives it → self.onmessage inside worker.js
Worker does work → then self.postMessage() to send result back to main thread
Main thread receives result → worker.onmessage in main.js

Web page (`index.html`)

Main thread (`main.js`)

Worker thread (`worker.js`)

PreviousWeb NextWindow postMessage API

Last updated 7 days ago

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>Web Worker Example</title>
</head>
<body>
  <button id="run">Run Worker</button>
  <script src="main.js"></script>
</body>
</html>

const worker = new Worker("worker.js");

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

document.getElementById("run").onclick = () => {
  worker.postMessage(21);
};