Recipe

WebRTC Patterns

Production-grade signaling, NAT traversal, and media topology recipes for real-time peer connections.

Signaling State Machine

Model offer/answer exchange as a deterministic FSM with explicit transitions: idle → local-offer → remote-answer → connected. Reject out-of-order SDP to prevent glare.

states: idle | local-offer | remote-offer | connected
on local-offer + remote-answer → connected
on remote-offer + local-answer  → connected
default → rollback + renegotiate

TURN-over-TCP Fallback

When UDP is blocked, cascade ICE candidates: host → srflx → relay TCP. Provision TURN on :443 with TLS to evade deep-packet inspection.

iceServers: [{
  urls: "turns:turn.example.com:443",
  username: "meridian",
  credential: process.env.TURN_SECRET
}]

Mesh vs SFU Topology

For N ≤ 4 peers, full mesh with simulcast keeps latency minimal. Beyond 4, route through a Selective Forwarding Unit to cap upstream bandwidth at one encode per sender.

Data Channel Multiplexing

Open a single ordered DataChannel and frame messages with a 2-byte type prefix. Avoid per-channel setup latency when sending chat, cursor sync, and presence updates concurrently.