我们正在考虑在我们的应用程序中用 ExtJS 图表替换 FusionCharts，因为:
- 我们已经在整个 UI 中使用了 ExtJS。如果能消除另一个商业第三方依赖项和 API 的开销和费用，那就太好了。
- 我们希望能够在无 Flash 移动设备上显示这些图表。
- 与普通的 DOM 对象相比，扩展和管理 FusionCharts 的 Flash 组件要困难得多。
- 我们应用程序的一些特定页面上塞满了图表(大约有数百个类似 Spark 的图表)，而 Flash 正在吞噬内存，就像它要过时了一样。
我查看了 FusionCharts 的 JavaScript 回退，它在美学上还不够。另外，我不想要一个“后备”的 JavaScript 实现。
我们目前使用的是 ExtJS 3.2.0。短期内升级到 4.x 是不可能的，但如果我们认为值得付出努力，我们可能会沙箱化 Ext 4 以仅使用其图表。
所以我的问题本质上是ExtJS 4 的 JavaScript 图表的性能是否明显优于 FusionCharts Flash 图表？我主要关心内存使用情况，其次是渲染时间。
我看到 this Stack Overflow question这表明，至少截至 2011 年 8 月，Ext 图表并没有真正达到标准。我知道 Sencha 在 4.1 中专注于提高稳定性和性能。有谁知道从那以后情况是否有所好转？
最佳答案
长话短说
通过使用 ExtJS 4.0.7 而不是 FusionCharts 3.2 中的图表，我发现内存使用量、CPU 负载和渲染时间显着减少，通常减少 70-85%。
简介
我最近有时间测试 Ext 的图表。重写组件以将 Ext 4 图表集成到 Ext 3 面板中有点痛苦，但经过几天的工作，我可以绘制来自服务器的实际数据图表。
我试图解决的基本图表问题如下图所示:
我们绘制了设备上多个 socket 的功率读数趋势图。这在 FusionCharts 中运行良好，直到我们最近开始渲染具有 168 个 socket 的设备(并且可能在单个页面上呈现多个这样的设备)。我怀疑没有浏览器能够处理那么多的 Flash，所以我构建了一个基本页面来呈现这些设备之一，并在几个不同的浏览器中对其进行了测试。
测试结果
“F”表示 FusionCharts。 “E”表示 ExtJS。
硬件:
- OS X:15 英寸 MacBook Pro 5,1、2.4 GHz Intel Core 2 Duo、4 GB 内存
- Win7:21 英寸 iMac 4,1、1.83 GHz Intel Core 2 Duo、2 GB 内存
- WinXP:在 VirtualPC 中运行 XP 的同一台 iMac(1 GB RAM)
=========
OS X 10.7
=========
Browser/Test Real Mem (MB) Virt Mem (MB) Priv Mem (MB) CPU (%) Render (s)
--------------------------------------------------------------------------------------------
Chrome 17.0.963.56
F1 653 532 333 14 22.8
F2 648 535 336 15 22.7
F3 656 538 339 15 22.3
--- --- --- --- ----
652 535 336 15 22.6
E1 104 129 80 0 4.0
E2 104 129 80 0 4.7
E3 104 129 80 0 3.7
--- --- --- --- ----
104 129 80 0 4.1
+/- -84% -76% -76% -100% -82%
Firefox 10.0.2
F1 905 450 257 14 10.1
F2 889 435 242 15 10.5
F3 889 465 272 15 10.1
--- --- --- --- ----
894 450 257 15 10.2
E1 239 230 161 0 3.5
E2 256 215 177 0 3.7
E3 253 218 181 0 4.6
--- --- --- --- ----
249 221 173 0 3.9
+/- -72% -51% -67% -100% -62%
Safari 5.1.3
F1 1070 998 717 16 22.7
F2 1130 993 670 16 23.0
F3 1120 902 631 17 22.9
---- --- --- --- ----
1107 964 673 16 22.9
E1 153 290 125 0 3.4
E2 153 291 125 0 3.5
E3 153 291 125 0 3.3
---- --- --- --- ----
153 291 125 0 3.4
+/- -86% -70% -81% -100% -85%
=========
Windows 7
=========
Browser Working Set (MB) Priv Working Set (MB) Commit Size (MB) CPU (%) Render (s)
------------------------------------------------------------------------------------------------------
Chrome 17.0.963.56
F1 638 619 633 45 16.9
F2 639 620 633 43 16.8
F3 639 620 633 45 16.9
--- --- --- --- ----
639 620 633 45 16.9
E1 100 85 96 0 4.4
E2 95 81 92 0 4.5
E3 101 87 98 0 4.3
--- --- --- --- ----
99 84 95 0 4.4
+/- -85% -87% -85% -100% -74%
Firefox 10.0.2
F1 650 638 657 52 11.5
F2 655 641 659 54 16.9
F3 650 638 656 52 11.4
--- --- --- --- ----
651 639 657 52 13.3
E1 138 111 119 0 3.6
E2 141 113 121 0 3.6
E3 134 106 114 0 3.8
--- --- --- --- ----
138 110 118 0 3.6
+/- -79% -83% -82% -100% -73%
IE 9.0.8112.16421
F1 688 660 702 19 13.1
F2 645 617 661 16 19.0
F3 644 615 660 15 19.0
--- --- --- --- ----
659 631 674 17 17.0
E1 100 73 90 0 4.8
E2 98 73 90 0 4.5
E3 99 73 90 0 4.3
--- --- --- --- ----
99 73 90 0 4.5
+/- -85% -88% -87% -100% -74%
==========
Windows XP
==========
Browser/Test Mem Usage (MB) Virt Mem Usage (MB) CPU (%) Render (s)
--------------------------------------------------------------------------------
IE 8.0.6001.18702
F1 653 658 56 19.5
F2 652 658 58 19.6
F3 652 658 60 18.9
--- --- --- ----
652 658 58 19.3
E1 272 266 2 38.5
E2 271 266 2 37.4
E3 271 266 2 37.3
--- --- --- ----
271 266 2 37.7
+/- -58% -60% -97% +95%
IE 7.0.5730.13
F1 721 726 80 29.1
F2 691 698 75 25.9
F3 695 698 78 27.0
--- --- --- ----
702 707 78 27.3
E1 302 294 1 67.4
E2 301 294 0 66.5
E3 301 294 0 65.8
--- --- --- ----
301 294 0 66.6
+/- -57% -68% -100% +144%
Notes:
- CPU (%) was measured once the charts had finished rendering and
the browser was idling.
- Render (s) was the time measured between when the data finished
loading and when the charts were fully rendered and usable.
结论
除了在 IE8 和 IE7 上的渲染时间之外，在每个指标中，ExtJS 图表的表现都大大优于 FusionCharts。虽然测试是针对我们的用例的，但我希望在类似情况下看到类似(如果不那么剧烈)的结果——即，单个页面上有很多图表。
更不用说原生图表的定性优势，例如真正的 DOM 脚本和样式、与 ExtJS 框架的其余部分的直接集成以及在无 Flash 移动设备上访问图表。如果您能投入时间，Ext 4 中的图表将是一个巨大的胜利。
关于extjs - ExtJS 图表是否比 FusionCharts 表现更好？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9238032/