ck1llc

Chart 组件渲染性能问题

  •  
  •   ck1llc ·
    ck1llc · Mar 9, 2016 · 3271 views
    This topic created in 3754 days ago, the information mentioned may be changed or developed.

    前提:

    公司产品目前使用的图表组件是 FusionCharts flash 版本,新版产品中准备去除产品中 flash 相关组件。

    目前可选组件有: FusionCharts JS 版( FusionCharts Suite XT v3.10.0 ), HighCharts , ECharts 。
    从性能测试结果来看, HighCharts 和 ECharts 性能接近,甩 FusionCharts 一大截。
    从图形扩展性来看, ECharts 缺少 3D 图的支持,不满足目前产品对图表组件的要求。

    我个人比较倾向 HighCharts ,但是由于工作量及前向兼容问题,领导要求使用 FusionCharts 。

    问题

    FusionCharts 和 HighCharts 都是使用 svg 绘图的,但是同样数据量下,渲染速度, CPU 及内存差别巨大。在 30 线*168 点数据量下(吐槽下领导定的规格,什么都看不清楚), HighCharts 很快能加载出来,且操作流畅。 FusionCharts 往往导致 Chrome 无响应。

    自己非专业前端,使用 chrome 的 profiles 工具也瞧不出什么眉目,求前端大神指点下两者究竟性能差在哪儿!


    Demo 如下:由于线条过多时,浏览器容易卡死,请修改变量 lineNumber 后测试
    FusionCharts Demo:
    http://jsfiddle.net/ck1llc/bpksx1yk/

    HighCharts Demo:
    http://jsfiddle.net/ck1llc/uadzf2bt/

    2 replies    2016-03-12 16:57:52 +08:00
    ck1llc
        1
    ck1llc  
    OP
       Mar 10, 2016
    是我描述得不清楚呢,还是这两个组件用得人比较少···
    wyc829
        2
    wyc829  
       Mar 12, 2016
    源码看得少..
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   1445 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 34ms · UTC 16:37 · PVG 00:37 · LAX 09:37 · JFK 12:37
    ♥ Do have faith in what you're doing.