有多个 JavaScript 库(例如Dagre.js、Cola.js)用于计算DAG(有向无环图)布局;即,计算节点和链接的坐标以最小化链接的总长度和交叉链接的数量。
在我们的 Web 应用程序中,我们使用Dagre.js来计算 DAG 的布局,具有以下规范:
- 可能有一个或多个根。
- DAG(s) 从左到右生长,所以根应该总是在左边。
- DAG 很大(大约 1,000 个节点)。
- 所有节点的宽度相同,但高度不同。
- 节点是集群的。
我编写了这个 CodeSandbox来生成随机 DAG 并展示Dagre.js有多慢。笔记:
- 默认情况下,它会生成一个包含 100 个节点的随机 DAG。您可以通过修改第 17 行 (
let nodes = 100;
) 来更改音符的数量。 - 在第 56 行计算完布局后,您会看到将单个节点添加到图中所花费的时间与第一次计算布局所花费的时间几乎相同。这使得在浏览器中与大型 DAG 进行交互几乎是不可能的。
问题:我们如何更有效地计算 DAG(s) 布局?