admin/flowgram.ai
1
0
Fork 0
mirror of https://gitee.com/ByteDance/flowgram.ai.git synced 2025-07-07 17:43:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: update en docs

Browse Source
This commit is contained in:
dragooncjw 2025-02-28 16:46:28 +08:00
parent a9e1b02ba5
commit 4a2e5becba
2 changed files with 40 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
apps/docs/src/en/guide/concepts/_meta.json
View File

@ -2,6 +2,7 @@
"canvas-engine", "canvas-engine",
"node-engine", "node-engine",
"variable-engine", "variable-engine",
"ECS", "ecs",
"IOC" "ioc",
"reactflow"
] ]

37
apps/docs/src/en/guide/concepts/reactflow.mdx Normal file
View File

@ -0,0 +1,37 @@
# Comparison with ReactFlow
[Reactflow](https://reactflow.dev/) is an excellent open-source project with clear architecture and code. However, it focuses on low-level flow rendering engine architecture (Node, Edge, Handle), requiring extensive development at the upper layer to adapt to complex scenarios (such as fixed layouts, which need data modeling and layout algorithms). Advanced features are paid.
Compared to ReactFlow, FlowGram aims to provide a complete out-of-the-box solution for flow editing.
- Below are the pro paid features officially provided by ReactFlow
| Paid Features | Supported by FlowGram | Future Plan |
|----------------------------------|------------------------|--------------|
| Grouping | Supported | |
| redo/undo | Supported | |
| copy/paste | Supported | |
| HelpLines | Supported | |
| Custom nodes and shapes | Supported | |
| Custom edges | Supported | |
| AutoLayout | Supported | |
| ForceLayout | Not Supported | No |
| Expand/Collapse | Supported | |
| Collaborative | Not Supported | Yes |
| WorkflowBuilder (Fixed Layout Example) | Supported | |
- ReactFlow events are bound to atomized DOM nodes and built-in, making interaction customization costly. Deep development requires understanding its source code. For example, it's difficult to select points when the canvas is zoomed out:
<table>
<tr>
<td>
<div className="rs-tip">Since events are bound to SVG, it's difficult to click on elements when zoomed out</div>
<img src="@/public/reactflow/reactflow-render.gif"/>
</td>
<td>
<div className="rs-tip">FlowGram's events use global mousemove monitoring and calculate positions with Threshold, allowing clicks even when zoomed out, while also supporting edge reconnection</div>
<img src="@/public/reactflow/reactflow-interaction.gif"/>
</td>
</tr>
</table>