Designing a Unified Browser Message Communication Library (rpc-shooter) with TypeScript Interfaces and JSON-RPC

The article introduces postMessage as a common mechanism for communication between embedded contexts such as iframe and Web Workers, and explains the need for a higher‑level utility library called rpc-shooter that abstracts the various browser messaging APIs (Window, Worker, SharedWorker, ServiceWorker, MessageChannel, BroadcastChannel, MessagePort).

It starts with a simple parent‑child iframe example, showing raw postMessage usage, then proposes a unified message format and handler map to simplify complex scenarios.

Next, the article treats message communication as an event system, borrowing ideas from socket.io. It defines TypeScript interfaces for RPC handlers and events, and presents a class RPCMessageEvent that encapsulates the sending and receiving endpoints, automatically wiring addEventListener and postMessage calls.

interface RPCHandler { (...args: any[]): any; }
interface RPCEvent { emit(event: string, ...args: any[]): void; on(event: string, fn: RPCHandler): void; off(event: string, fn?: RPCHandler): void; }
// ... (full class implementation omitted for brevity)

The design emphasizes interface‑first development, allowing the same abstraction to work with any object that implements a message event and a postMessage method, such as MessagePort or BroadcastChannel.

To make remote calls more ergonomic, the article introduces a promisify layer that maps a request event (prefixed with syn:) to a response event (prefixed with ack:) and returns a Promise. It also discusses error handling, timeouts, and data‑serialization issues.

Finally, the article adopts the JSON‑RPC 2.0 specification, defining request and response structures ( RPCSYNEvent, RPCSACKEvent) and showing how to wrap the event system into a full‑featured RPC client/server that can be used with rpc-shooter or swapped for other transports like socket.io. Example usage in both the main page and a child worker is provided.

The article concludes with a brief mention of the comlink library for worker communication and encourages readers to try the rpc-shooter tool.