Server-Sent Events (SSE)

You are watching a live sports score page. Goals, fouls, substitutions, they appear on your screen the moment they happen. You did not click refresh. You did not press any button. The server just pushed the update to you.

Now here is the question: do you need to send anything back to the server while watching scores? No. You are just receiving. One-way traffic, server to client.

This is exactly the scenario Server-Sent Events were designed for. Unlike WebSockets, which establish a two-way channel, SSE opens a one-way pipe from the server to the browser. The server pushes events whenever it wants. The client listens.

The strength of SSE is that it is built directly on HTTP. No protocol upgrade. No special handshake. No binary framing. Just a long-lived HTTP response that the server keeps writing to. Your existing HTTP infrastructure (load balancers, CDNs, proxies, caching layers) works with SSE out of the box. Try saying that about WebSockets.

ChatGPT and Claude use SSE to stream tokens to your browser as the model generates them, word by word. That "typing" effect you see? That is SSE delivering one token at a time over a single HTTP connection.

The client opens a connection using the browser's built-in EventSource API:

const source = new EventSource('/api/events');

source.onmessage = (event) => {
 console.log('New event:', event.data);
};

The server responds with Content-Type: text/event-stream and keeps the connection open:

HTTP/1.1 200 OK
Content-Type: text/event-stream
Cache-Control: no-cache
Connection: keep-alive

data: {"score": "1-0", "minute": 23}

data: {"score": "1-1", "minute": 45}

data: {"score": "2-1", "minute": 67}

Each event is a plain text block starting with data: and separated by blank lines. That is it. No binary frames, no opcodes, no masking. Just text over HTTP.

Built-in features that WebSockets lack:

• Automatic reconnection. If the connection drops, the browser automatically reconnects after a configurable delay (default 3 seconds). You write zero reconnection logic.
• Event IDs. The server can tag events with IDs. When the client reconnects, it sends a Last-Event-ID header, and the server can replay missed events from that point.
• Named events. The server can send different event types (event: price-update, event: trade-executed), and the client can listen to specific types using addEventListener.