Dashboard

Pulseboard

A real-time service monitoring board that streams a million events per minute into readable charts.

Placeholder preview of the Pulseboard interface

Project data

Role
Full-stack developer
Type
Dashboard
Stack
  • Go
  • React
  • WebSockets
  • ClickHouse
Duration
4 months
Year
2024
Status
Archived
Links
Private project

The challenge

Too much data, too little signal

Operators watched dozens of tabs and still missed incidents.

The board had to aggregate on the server and render smoothly on a wall display.

How it was built

Development process

Six phases from the first conversation to the release. The bar shows how the time was split.

6 weeks in total

  1. Research

    On-call engineers replayed recent incidents and marked where the first signal had been missed.

    3 days · Incident timeline

  2. Architecture

    Data model, rendering strategy and API contracts were agreed before the first screen was drawn.

    4 days · ADR, data model

  3. Interface

    A component inventory and responsive layouts, built entirely from design tokens.

    4 days · Token set, component inventory

  4. Build

    Features went live in small slices behind flags, with typed boundaries between client and server.

    12 days · Feature slices

  5. Testing

    Unit, end-to-end and accessibility checks ran on every pull request.

    4 days · Test suite in CI

  6. Deployment

    Every branch got a preview environment; the production rollout was a single click.

    3 days · Preview and release pipeline

  7. Result

    Mean time to detect incidents fell from nine minutes to under two.

Screens

Outcome

The results

Placeholder preview of the Pulseboard interface

What changed after launch

Mean time to detect incidents fell from nine minutes to under two.

  • Go
  • React
  • WebSockets
  • ClickHouse

Key figures

Events / min
1M
Live charts
60fps
Infra cost
−35%

Under the hood

Streaming rollups

A Go service consumes the event stream, maintains rolling windows and pushes compact deltas over WebSockets.

The client keeps a ring buffer per chart and draws with requestAnimationFrame, staying at 60 fps.

  • Go
  • React
  • WebSockets
  • ClickHouse

Next project

Want something similar? Let’s talk.

Let’s talk

Tell me about your project. I usually reply within two working days.