38.3k stars · MIT · @xyflow/react v12.11.3 (2026-08-12) · Track this in Scout
React Flow — node-and-edge canvas with pan, zoom, minimap; the most direct way to render Grasppy's subtopic map.
▶Repo detailsthe review · specs · pros & cons
What it is
A React library for node-and-edge canvases with pan, zoom, minimap, selection and fully custom node rendering built in. You hand it nodes and edges as plain JSON and it gives you an interactive diagram.
What it is good for. This is the shortest path from a topic pipeline to the thing users actually touch. Each subtopic becomes a node; each node is an ordinary React component, so it can be a summary card built from the app's existing UI; clicking expands children or opens the underlying text. The pan/zoom/collapse behaviour you'd otherwise spend months hand-rolling arrives free — and because it's so widely used, Claude Code writes correct code for it on the first try.
- Nodes are real React components — reuse the UI already in the app
- Enormous documentation surface, so Claude generates reliable code
- Purely client-side: zero added VPS cost
- DOM-based rendering starts to slow past roughly 1,000–2,000 visible nodes
- No layout algorithm included — you add dagre or elkjs and tune it
- Some polish features sit behind the paid React Flow Pro subscription
FastAPI returns {nodes, edges} from your topic pipeline; the React app feeds it into <ReactFlow> and calls a detail endpoint on node click.
