Same-Browser Sync — Edits sync between browser tabs using BroadcastChannel. Click “Open Another Tab” to see cursors and changes sync instantly.
// BroadcastChannel — same browser, zero infrastructure
const channel = new BroadcastChannel("my-room");
// Broadcast local changes
store.subscribe((state) => state.current, (container) => {
channel.postMessage({ type: "update", payload: container });
});
// Apply remote changes
channel.onmessage = (event) => {
if (event.data.type === "update") {
store.getState().dispatch({
type: "REPLACE_CONTAINER",
payload: { container: event.data.payload },
});
}
};