Plate 05 · Data visualisation
Data Context Hub: a canvas that stays smooth with huge graphs
Some problems only make sense when you can see them. I built an interactive canvas where people explore graphs, algorithms and big datasets, and it stays smooth as the data grows.
- Role
- Frontend engineer
The problem
Graph visualisations tend to be fine in a demo and unusable with real data. Once there are enough nodes, dragging lags, zooming stutters, and the tool stops helping anyone think.
What I did
- Built the interactive canvas with React Flow on Next.js and React 19.
- Separated canvas state (Zustand) from server data (TanStack Query), so interactions stay local and fast while the data syncs in the background.
- Paired the canvas with tabular views (TanStack Table), so users can move between the picture and the underlying rows.
- Tuned rendering for large datasets, keeping real-time interaction smooth at scale.
How it works
Canvas (React Flow). Nodes, edges, pan and zoom.
Canvas state (Zustand). Instant, local interactions.
Data (TanStack Query). Fetched, cached and synced.
Table view (TanStack Table). The same data as rows.
Stack
Let's build the whole thing properly.
An MVP, a rebuild, or a system that has to survive launch day. Tell me what you're building in a 30-minute call.
Senior full-stack, remote, CET.
Available as a long-term contractor on a monthly rate, embedded in your team, or full-time. Seven years across React, Node and the cloud, plus CTO experience.