Web Sockets vs Server-Sent Events Cheat Sheet

Compares WebSocket and Server-Sent Events with working code for both, plus guidance on which real-time approach fits your use case.

2 PagesIntermediateMar 20, 2026

Server-Sent Events (Client + Server)

One-way streaming updates over plain HTTP.

javascript

// Clientconst events = new EventSource('/api/notifications');events.onmessage = (event) => {  console.log('Default message:', event.data);};events.addEventListener('priceUpdate', (event) => {  const data = JSON.parse(event.data); // custom named event  console.log('Price:', data.price);});events.onerror = () => console.log('Connection lost, browser will auto-reconnect');// Server (Node/Express) — must send the right content type and flushapp.get('/api/notifications', (req, res) => {  res.set({    'Content-Type': 'text/event-stream',    'Cache-Control': 'no-cache',    Connection: 'keep-alive',  });  const timer = setInterval(() => {    res.write(`event: priceUpdate\ndata: ${JSON.stringify({ price: Math.random() })}\n\n`);  }, 2000);  req.on('close', () => clearInterval(timer));});

WebSocket Equivalent

The same feature, but full-duplex.

javascript

// Clientconst socket = new WebSocket('wss://example.com/notifications');socket.onmessage = (event) => console.log('Received:', event.data);socket.onopen = () => socket.send(JSON.stringify({ type: 'subscribe', channel: 'prices' }));// Server (ws) — bidirectional, client can also push datawss.on('connection', (ws) => {  ws.on('message', (msg) => console.log('Client sent:', msg.toString()));  setInterval(() => ws.send(JSON.stringify({ price: Math.random() })), 2000);});

Key Differences

How the two protocols actually differ under the hood.

Direction- SSE: server-to-client only. WebSocket: full-duplex, both directions
Protocol- SSE runs over plain HTTP. WebSocket upgrades the connection via ws:// / wss://
Reconnection- SSE auto-reconnects natively (EventSource); WebSocket needs manual reconnect logic
Data format- SSE is text-only (UTF-8). WebSocket supports both text and binary frames
Connection limits- SSE over HTTP/1.1 caps at ~6 concurrent connections per domain; HTTP/2 removes this
Proxy friendliness- SSE, being plain HTTP, traverses proxies more reliably than a WebSocket upgrade

When to Choose Which

Matching the protocol to your data flow.

Use SSE- One-way live feeds: notifications, stock tickers, live scores, log streaming
Use WebSocket- Bidirectional interaction: chat apps, multiplayer games, collaborative editors
SSE for simplicity- No extra client library needed; works with plain EventSource and standard HTTP infra
WebSocket for binary/low-latency- Better suited for high-frequency, low-latency, or binary payloads
Infrastructure cost- WebSocket servers hold a stateful connection per client, which complicates horizontal scaling

Pro Tip

If you only need server-to-client push and the client never needs to send data back over the same connection, prefer Server-Sent Events — you get automatic reconnection and simpler infrastructure for free.

Was this cheat sheet helpful?

Cookies & Local Storage Cheat Sheet

Micro Frontends Cheat Sheet

Explore Topics

#WebSocketsVsServerSentEvents#WebSocketsVsServerSentEventsCheatSheet#WebDevelopment#Intermediate#Server#Sent#Events#Client#Networking#CheatSheet#SkillVeris

Sri Hayavadhana Info-Tech

Professional Web Designing Services