WebSockets are full duplex. Both server and client can send messages at any time. Perfect for chat or multiplayer games.

SSE is unidirectional which means that server pushes, client listens. That is it.

For a monitoring dashboard, the client never needs to push data through the real time channel. The server detects a status change and broadcasts it. SSE is the correct tool.

IF your client only needs to receive updates use SSE> If it needs to send and receive use WebSockets.

The problem nobody mentions which is EventSource can't send headers.

The browser's native EventSource API is clean and handles auto re-connection natively . One problem, it does not support custom headers.

You cannot send Authorization: Bearer with EventSource. For any protected endpoint., that is a deal breaker.

// This does not work
const es = new EventSource('/stream', {
    headers: {Autorization: `Bearer ${token}`}
});

The fix is fetch based SSE

use fetch() with Authorization header and read the response body as a stream.

const response = await fetch(`monitors/${id}/stream`, {
    headers: { Authorization: `Bearer ${token}` }
});

const reader = response.body.getReader();
const decoder = new TextDecoder();

while(true) {
    const {done, value} = await reader.read();
    if(done) break;
    const text = decoder.decode(value);
    for (const line of text.split('\n')) {
        if(line.startsWith('data: ')) {
            const data = JSON.parse(line.slice(6));
            // handle the event
        }
    }
}

// cleanup on unmount
reader.cancel();

response.body.getReader() gives you a ReadableStreamDefaultReader. Unlike a normal fetch, it returns chunks as they arrive. Exactly how SSE works.

The server side (Fastify)

reply.raw.setHeader('Content-Type', 'text/event-stream');
reply.raw.setHeader('Cache-Control', 'no-cache');
reply.raw.setHeader('Connection', 'keep-alive');
reply.raw.flushHeaders();
reply.raw.write('data: {"type":"connected"}\n\n');
addClient(monitorId, reply);
request.raw.on('close', () => removeClient(monitorId, reply));
// do NOT call reply.send() — that closes the connection

Write order matters:

The worker always writes check to DB -> Creates/resolves alert -> Pushes SSE. SSE is always last. The dashboard reflects already persisted state, never in-memory state.

Full Project: github.com/wavellen/uptime-pulse