Question

我正在测试Cytoscape.js的渲染性能。

我的图表包含大约5000个节点和5000个没有x，y位置的边缘，使用Cytoscape.js的自动布局。但在渲染所有节点和边缘后，使用欧拉布局扩展需要超过15秒，图形页面的浏览器会在下一次操作中卡住一段时间或缓慢响应。正如所说，Cytoscape.js受到浏览器性能的限制。我们从java服务器客户端加载json数据，并使用for循环加载数据，然后使用layout.run（）运行自动布局。如何用大数据提高性能？

具有x，y位置的数据会提高性能，对吧？但我们不知道如何在Java中传播x，y位置。能给我看看么？在Cytoscape.js中有布局的java插件吗？

Answer 1

Cytoscape.js不可能与实际的大数据（即terrabyte或更多）一起使用，因为它在浏览器中运行。即使对于中等大小的节点（如5000个节点和边缘），对于Cytoscape.js来说，15秒听起来也是正常的。

问题是JavaScript在诸如图形布局之类的任务中速度较慢，因为现代CPU具有越来越多的内核，并且JavaScript的并行性实现（网络工作者）对于迭代次数很多的算法的开销太大，因为所有线程的结果必须被整合。而且，据我所知，GPU计算更难在JavaScript中完成。

这两个问题都可能在将来得到解决，Cytoscape.js的开发者Max Franz似乎非常活跃和支持，因此，如果JavaScript获得更好的并行化和GPU计算支持，我肯定会发现很快就会进入Cytoscape.js。

目前，您可以尝试一些解决方法：

图总是一样吗？然后，您可以预先计算布局并将其作为预设布局加载。
该图至少不经常更改吗？然后，您可以缓存布局，并仅在必要时重新计算。

我不知道“在Java中循环x，y位置”是什么意思，是“在JavaScript（！）库Cytoscape.js中加载预设布局”吗？如果是这样，则在这里进行解释：http://js.cytoscape.org/#layouts/preset。具体来说，您可以定义x和y坐标，例如：

let options = {
  name: 'preset',
  positions: ... // map of (node id) => (position obj); or function(node){ return somPos; }
...

也有一些图形可视化功能，其功能要比Cytoscape.js少，但速度更快，因此，如果您不需要任何功能而只想可视化一个简单的图形，则可以尝试ngraph，观看http://www.yasiv.com/graphs#Bai/rw5151上的演示。

Cytoscape.js的性能和布局

1 个答案: