flowglGPU-accelerated flowchart library

Why flowgl ​

Diagramming libraries today are either DOM/SVG-based and bottleneck at ~1k nodes, or they require buying into a single framework. flowgl renders the whole graph — nodes, edges, text, minimap — through one WebGL2 context, and the same FlowChart class is the public API whether you use it from vanilla TS, React, Vue, or Svelte. A Canvas 2D fallback ships behind the same Renderer interface for environments without WebGL2.

import { FlowChart } from '@flowgl/core'

const chart = new FlowChart({
  container: document.getElementById('app')!,
  nodes: [
    { id: 'a', x: 100, y: 100, width: 140, height: 60, label: 'Source' },
    { id: 'b', x: 320, y: 100, width: 140, height: 60, label: 'Transform' },
    { id: 'c', x: 540, y: 100, width: 140, height: 60, label: 'Sink' },
  ],
  edges: [
    { id: 'e1', source: 'a', target: 'b' },
    { id: 'e2', source: 'b', target: 'c', animated: true },
  ],
})

chart.on('connect', ({ sourceId, targetId }) => {
  console.log('connected', sourceId, '→', targetId)
})

Where to next ​

• New here? Start with Get started.
• Coming from React Flow? See Why flowgl for the comparison and the migration notes.
• Looking for a specific recipe? Check the Cookbook.
• Want to see it run? The examples gallery has every built-in feature in 30 lines or fewer.

Open source, MIT ​

flowgl is MIT-licensed and community-funded. There is no Pro tier, no gating, no commercial path planned. If you want to keep maintenance flowing, the GitHub Sponsors button is on the repo and on the maintainer's profile.

The roadmap is public; contributions through PRs, Discussions, and issues are all welcome. The contribution guide has the full flow.