←All work
Developer Tooling · Side ProjectCreator20252025

SSE Formatter

↗

A developer tool that turns a raw Server-Sent Events stream into a readable, searchable timeline. Built for debugging agent and LLM runs where events otherwise fly by as an unreadable wall of text.

SSE Formatter turning a raw Server-Sent Events stream into a readable timeline

10+

event types

3

inspector views

Live

deployed

Overview

SSE Formatter is a small developer tool for making sense of streaming events. Paste a raw Server-Sent Events stream from an agent or LLM run and it becomes a readable, searchable timeline you can filter, inspect, and diff, all in the browser with nothing sent to a server.

The challenge

Debugging agent and LLM runs over SSE is painful. The stream is a flat firehose of run_started, tool_call events, message deltas, and completion payloads, and reading it raw in the network tab or a terminal makes it almost impossible to follow what the agent actually did.

The approach

I built a browser-based formatter that parses the stream into a structured timeline. Every event is typed, color-coded, and counted, with a filter bar and full-text search across payloads. Open any event and you get Pretty, Raw, and Diff views, so you can see exactly what changed between one chunk and the next, and copy any event as JSON.

What made it work

01

A readable timeline

A raw stream becomes a numbered, color-coded list of typed events, so a run you used to read as a wall of text is scannable at a glance.

02

Search, filter, inspect

Filter by event type with live counts, search across payloads, and open any event for Pretty, Raw, or Diff views against the previous one.

03

Paste and go

Everything runs client-side. Paste a stream or start fresh, copy any event as JSON, and share nothing with a server.

A look inside

SSE Formatter interface, view 1

Built with

Next.jsReactTypeScriptTailwind CSS

Have a project in mind?

Let's build something worth shipping.

Start a conversation→