IWPC — Inter-Window Procedure Call

Shared counter

Same counter demo as Parent 1, but with the BroadcastChannel transport. The child opens with noopener — there is no DOM reference between the two windows.

Count0

Child window

Pairing happens via a query-param handshake — the child broadcasts NOTIFY_WINDOW_ID and the parent replies. Reload the child: it re-pairs automatically.

Code

Same shape as the postMessage demo — only the transport option changes.

parent.tsx

import { useIwpcWindow } from '@silurus/iwpc';

const iwpc = useIwpcWindow({
  transport: 'broadcastChannel',
  // channelName: 'myapp:iwpc', // pin per app to avoid origin-wide collisions
});

useEffect(() => {
  iwpc?.register('INCREMENT_COUNTER', () => setCount((c) => c + 1));
  return () => iwpc?.unregister('INCREMENT_COUNTER');
}, [iwpc]);

// noopener by default — no Window reference between the two sides.
const child = await iwpc?.open('./child2', { width: 520, height: 540 });
child?.invoke('INCREMENT_COUNTER');