Mobile SharedWorker Compatibility Tester

Mobile-specific gotchas

Platform support matrix

Build for Android first — progressive fallback

1. 1 SharedWorker — feature detect: typeof SharedWorker !== 'undefined'. Best for: multi-tab state, shared WebSocket, auth token store. Works on Chrome 140+ Android, all desktop browsers.
2. 2 BroadcastChannel — fallback when SharedWorker is absent. Best for: broadcasting events across tabs (no persistent state). Works on all modern browsers including Chrome iOS.
3. 3 localStorage events — last resort. Write to a localStorage key; other tabs receive the storage event. Reliable but synchronous writes can block the main thread. No iOS restriction.

// Progressive fallback chain
let channel;

if (typeof SharedWorker !== "undefined") {
  // Best: SharedWorker — persistent, rich API surface
  const sw = new SharedWorker("/worker.js", { name: "app-bus" });
  sw.port.start();
  channel = {
    send: msg => sw.port.postMessage(msg),
    onmessage: cb => { sw.port.onmessage = e => cb(e.data); }
  };
} else if ("BroadcastChannel" in window) {
  // Good: BroadcastChannel — no persistent worker, but works everywhere
  const bc = new BroadcastChannel("app-bus");
  channel = {
    send: msg => bc.postMessage(msg),
    onmessage: cb => { bc.onmessage = e => cb(e.data); }
  };
} else {
  // Fallback: localStorage events
  channel = {
    send: msg => {
      localStorage.setItem("app-bus", JSON.stringify({ msg, ts: Date.now() }));
    },
    onmessage: cb => {
      window.addEventListener("storage", e => {
        if (e.key === "app-bus") cb(JSON.parse(e.newValue).msg);
      });
    }
  };
}