流程图控件GoJS教程:GoJS图表的感知性能注意事项

GoJS是一款强大的流程图控件,适用于JavaScript和HTML5 Canvas。本文探讨了在处理大量节点和链接时如何优化图表的性能,包括避免昂贵效果、简化节点和链接、选择高效布局,以及实现虚拟化以提升大型图表的加载和渲染速度。同时,提到了其他优化技巧,如关闭阴影、动画和适时切换模板。
摘要由CSDN通过智能技术生成

GoJS是一款功能强大,快速且轻量级的流程图控件,可帮助你在JavaScript 和HTML5 Canvas程序中创建流程图,且极大地简化您的JavaScript / Canvas 程序。

点击下载GoJS最新版

性能考量

当图表仅限于数百个节点和链接时,尤其是在桌面上,则为图表获得良好的性能并不需要您付出任何努力。但是,当您的应用程序可能处理成千上万个节点和链接时,您可能需要调整实现以避免昂贵的功能。

图表的感知性能取决于许多不同的因素:

  • 在相同的硬件平台上,JavaScript代码通常比Java或.NET代码慢几倍至几倍。
  • 不同浏览器和浏览器版本之间的JavaScript代码性能有所不同。
  • 内存限制(特别是在移动设备上)会影响性能。
  • 不同平台上的绘图性能可能会有很大差异。
  • 绘图和动画效果占用资源。
  • 复杂的节点或链接比简单的节点或链接更慢地构建,更新和绘制。
  • 有些布局本来就比其他布局慢。

效果和外观

绘制阴影相对昂贵,因此请考虑不要将Part.isShadowed设置为true。渐变画笔比纯色的绘制速度慢。复杂形状 几何图形比简单形状几何图形绘制速度慢,并且在计算交点时需要更多的计算。

动画占用资源;考虑将AnimationManager.isEnabled设置为false。

构造节点并调整其大小

保持节点和链接尽可能简单。限制模板中使用的GraphObject数量。在可行的情况下使用更简单的面板类

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值