๐ŸŒฑ Still tending the garden โ€” a few corners are still growing
All writing

May 30, 20261 views

ReactFlow Is My Default For Workflow Editors

A short note on why ReactFlow keeps winning when I need to show how an AI pipeline actually fits together.

In this post

A lot of the AI work I ship ends up needing the same thing: a way to show users how the pieces connect. Inputs, models, tools, outputs โ€” there's almost always a graph hiding in there. Trying to render that with plain divs and arrows gets ugly fast.

ReactFlow has become my default whenever the answer is a graph.

Why I keep coming back

The thing ReactFlow gets right is that it gives me a real graph primitive to work with โ€” nodes, edges, selection, panning, zooming โ€” without forcing me to commit to any particular visual style. I bring my own nodes (just React components), my own edges, my own toolbar. The library handles the boring math.

That separation matters more than it sounds. Most diagram libraries either lock you into a look or hand you a low-level canvas and wave goodbye. ReactFlow sits in the right place between those two.

The parts that earn their keep

A few features have repeatedly justified the dependency for me:

  • Custom node types. Every workflow node ends up being a regular React component. Forms, badges, status indicators โ€” all of it lives inside the node, and selection state comes in as a prop.
  • Controlled state. I keep nodes and edges in my own state, so saving and loading workflows is just persisting that shape. No hidden internal store to fight.
  • The handle system. Multiple input/output ports per node, typed connections, validation on connect โ€” this is the part I'd most dread building from scratch.

Where I draw the line

ReactFlow is not the right answer for read-only diagrams. If a user is viewing a small dependency graph, a static SVG renders faster and weighs less. I reach for ReactFlow when the user is editing, or when interaction (hover, click, expand) is the whole point.

It's also overkill for tree-shaped data. Trees want a tree component, not a graph.

Final thoughts

ReactFlow earns its place in projects where the graph is the product surface, not just decoration. The moment I find myself reaching for absolute positioning and SVG path strings to fake edges between divs, I close the tab and install it.

It's one of those libraries I never regret reaching for.

Comments

Be the first to say something.