38

决定使用 D3.js 和 SVG 进行可视化后，现在看起来 SVG 可以在桌面浏览器或本机 shell 中正常工作，但我真的对 iOS 移动平台上性能速度的下降感到困惑。

根据以下测试，现在看起来 SVG 性能越来越好，并且与 Canvas 速度相差不远，这是个好消息：

坏消息是，如果您在新 iPad 上的 Safari 浏览器中运行这些测试，SVG 和 Canvas 的速度都会下降很多。可怕的消息是，如果您在 iPad 的新 Chrome 浏览器中运行这些测试，速度会下降得更多。

我读到谷歌被迫使用 Apple 的 Nitro JavaScript 引擎没有加速的 UIWebview。我还读到 Apple 正在推动 HTML5，但演示只能在他们自己的 Safari 浏览器中运行。

无论如何，这里有什么问题？我的应用程序的最佳目标是移动设备，但即使有像 D3.js 这样出色的 API 和像 SVG 这样的 HTML5 标准，性能也受到了限制，这仅仅是因为 Apple 想要为自己的议程保持进展吗？反正在我看来就是这样。我不确定这些测试在 Android 上是什么样子的？很高兴知道。如果测试结果是肯定的，也许我会摆脱 iPad 并直接使用 Android。

最重要的是，由于这些速度问题，我只是不确定使用 HTML5 技术制作我的应用程序是否可行？我也对学习 Objective-C 没有兴趣，因为未来将转向 HTML5。我相信网络及其标准，但看起来它们被阻止了。我很想知道这个困境的解决方案。

4

3 回答 3

7

iOS7 使用 JavaScript 动画 SVG 的性能非常差——尽管静态 SVG 绘图要快得多。我们写了一篇关于 iOS7 版本性能的博客，您可以查看更多血腥细节。

更新：iOS7.1 修复了 javascript 动画性能问题。恢复到 50 fps

于 2013-10-31T00:35:07.963 回答
3

我发现我的第一代 iPad 上的 d3.js/SVG 比在桌面浏览器（FF/Chrome/IE 9+）上运行相同的应用程序要慢得多。

我写了我在这里尝试的各种改进：http: //hivemindmap.blogspot.co.uk/2013/01/html5-and-interactive-graphs.html

于 2013-01-07T16:23:28.107 回答
0

移动设备上的性能通常低于桌面套件。一般来说，它们的硬件功能不那么强大（它更倾向于低功耗而不是完全的速度），而且它们的 RAM 和存储空间要少得多。我桌面上的 Chrome 有多个处理器、8GB RAM 和一个功能强大的 GPU。在我的 iPad 上，它没有任何地方接近那种功率水平。

第三方 iOS 应用程序（包括 Chrome）不能使用 Nitro，这是正确的。我相信这是因为 Nitro 能够将内存标记为可执行，并且（出于安全原因）不信任 3rd 方应用程序这样做。大多数 HTML5 内容都可以在 iOS 上的任何浏览器中运行（Opera Mini 可能除外）。画布和 SVG 动画会比 Safari 慢，因为它们都是由 Javascript 驱动的——再次，缺乏对 Nitro 的访问阻碍了它们。这不再是真的：从 iOS 8 开始，第三方应用程序现在可以使用可以访问与 Safari 相同的高速 javascript 引擎的WKWebView框架。

原生代码通常会更快，因为它更接近硬件，直接访问显示 API，而不是通过 Web 堆栈。

解决方案通常是简化一切。就像原生游戏开发者必须大幅降低他们的 3D 游戏的复杂性才能让它们在 iOS 设备上运行一样，Web 开发者也必须降低他们的 SVG 和画布应用程序的复杂性。一般来说，页面上飞来飞去的东西越少意味着性能越高。

您可以做很多技巧，并围绕该主题进行大量阅读。阅读http://www.html5rocks.com/en/tutorials/canvas/performance/、http://www.html5gamedevs.com/tag/performance/以及 Google 的其他内容。就我个人而言，我会建立一个概念证明并在完全放弃这个想法之前对其进行测试:)

于 2012-08-01T14:19:41.740 回答