Real-time transports

WebSocket vs Server-Sent Events

Compare bidirectional WebSocket messaging with a one-way SSE stream — same client UX patterns from the article, side by side.

Two patterns, one page

WebSocket Bidirectional

Connect, send messages, receive server push and echoes from every client.

Server-Sent Events Server → client

Long-lived HTTP stream with automatic reconnect — no client send channel.

WebSocket

Disconnected

Inbound messages

Type a message and press Send — your echo appears here as {"type":"echo",…}. Server push ticks every 3 seconds.

Server-Sent Events

Disconnected

Event stream

Receive-only stream — counter events arrive every 2 seconds as {"type":"sse",…}.

Simulated transports for the live playground — clone the repo and run npm start for the Express + WebSocket server.