Pulse Analytics
Real-time product analytics dashboard rendering millions of events with type-safe routing.
Client
Pulse Labs
Year
2024
Role
Frontend Lead
Category
Dashboard
Stack
- TanStack Start
- TanStack Query
- TanStack Table
- Laravel Octane
- ClickHouse
The challenge
Analysts needed shareable, filterable dashboards, but every filter change re-fetched everything and URLs could not be shared.
The solution
Moved all filter state into type-safe search params with TanStack Router, cached queries with TanStack Query and virtualised tables. Laravel Octane serves pre-aggregated ClickHouse queries.
10×
Faster filtering
100%
Shareable views
35M
Events / day
Before → After
What changed for analysts
Filter response
11× faster
before
3.2 s
after
0.28 s
Requests per filter change
14× less
before
14
after
1
JS shipped to the dashboard
4.5× less
before
1,900 KB
after
420 KB
Rows scrolled at 60fps
500× more
before
2,000
after
1M
Before → After
Where the speed came from
RoutingReact Router, filters in component state→TanStack Router, typed search paramsEvery filter lives in the URL, so any view can be shared
Data fetchinguseEffect + fetch per widget→TanStack Query with keyed cacheOne request per filter change instead of fourteen
TablesPaginated HTML tables→TanStack Table + virtualisationA million rows scroll without dropping frames
APILaravel on PHP-FPM→Laravel Octane on SwooleNo framework boot per request on hot endpoints
StorageRaw events queried in MySQL→ClickHouse with pre-aggregated rollups35M events a day stay queryable in milliseconds
Next project
Harbor Fleet→