PasserelleJS

TypeScript BroadcastChannel wrapper for structured Events and Async/Await.

It supports Event-driven Communication, Request/Response Pattern, Timeout Handling, and Type-safe Messaging.

• 🪶 1.2KB minified
• 🧩 Zero dependencies
• 📦 TypeScript and ESM
• 🧪 100% Test Coverage
• 🌐 Web Worker, Iframe, Multi-Tab

🚀 Usage

import { createChannel } from 'passerelle'

interface ChannelInterface {
  events: {
    sayHello: string
  }
  awaits: {
    performCalculation: (a: number, b: number) => Promise<number>
  }
}

const channel = createChannel<ChannelInterface>('channel-name')

channel.onEvent('sayHello', console.log)

channel.onAwait('performCalculation', (a: number, b: number) => {
  // simulate expensive calculation that could be running in a worker
  await new Promise((resolve) => setTimeout(resolve, 1000))
  return a + b
})

const result = await channel.sendAwait('performCalculation', 10, 20)
console.log(result) // 30

🔋 APIs

Creates a new channel, using the Broadcast Channel API.

createChannel(name: string): ChannelInstance

onEvent

Registers a listener to receive event messages.

channel.onEvent(action: string, (payload: T) => void): void

onAwait

Registers a listener to handle await messages.

channel.onAwait(action: string, (payload: T) => Promise<U>): void

sendEvent

Sends an event message to listeners.

channel.sendEvent(action: string, payload: T): void

sendAwait

Sends an await message to listeners.

channel.sendAwait(action: string, payload: T): Promise<U>

destroy

Closes the channel, aborts pending awaits and clears listeners.

channel.destroy(): void

📃 Inspiration

This project was inspired by GoogleChromeLabs/comlink and builds upon its core concepts.