Reference

SharedWorker

One process, many same-origin contexts. Normative: WHATWG Web workers.

Construct (each tab/window)

const worker = new SharedWorker("shared.js");
// optional name to distinguish instances:
// new SharedWorker("shared.js", "session-bus");

// Communicate via explicit port (not worker.onmessage)
worker.port.onmessage = (e) => { /* … */ };
worker.port.postMessage({ type: "hello" });

// If using addEventListener for "message", call start():
// worker.port.start();

Inside the shared worker

// SharedWorkerGlobalScope
onconnect = (e) => {
  const port = e.ports[0];

  port.onmessage = (ev) => {
    // handle; reply on this port only, or fan-out to all ports you stored
    port.postMessage({ type: "ack", echo: ev.data });
  };
  // port.start() if you used addEventListener instead of onmessage
};

Rules that matter

• All connecting browsing contexts must be same origin (protocol + host + port) — MDN.
• Stays alive while any page holds a reference; may keep alive briefly with extendedLifetime for cleanup (MDN lifetime notes).
• Cannot be constructed from a dedicated worker (constructor not exposed there).
• Still no DOM; still message-passing; clone/transfer rules apply per port.

vs alternatives

Debug

• Chrome: chrome://inspect/#workers
• Firefox: about:debugging#workers