
Building Real-Time Dashboards with WebSockets and React 19
Polling a REST endpoint every few seconds is fine until your dashboard needs to feel live. For a POS analytics view refreshing dozens of times a minute, we moved to a native WebSocket connection instead of reaching for a heavier pub/sub library.
React 19's concurrent rendering turned out to be the more interesting part of the build. Transactions streaming in at high frequency were wrapped in a transition, so the UI stayed responsive to clicks even while background updates were still committing.
We kept the WebSocket layer deliberately dumb — it just pushes normalized events into a small client-side store. All the aggregation (rolling totals, per-hour buckets) happens in selectors, which made it trivial to unit test independent of the socket connection.
Reconnection handling ended up being the trickiest part: a naive reconnect-and-refetch caused visible flicker on any network hiccup, so we added a short buffering window that reconciles missed events instead of blowing away local state.
The result is a dashboard that feels instant without over-engineering the transport layer — plain WebSockets were enough; we didn't need a dedicated real-time infrastructure product for this scale.
