Windows 7上的IE 9中的HTML 5 Canvas性能

时间:2012-11-17 00:29:40

标签: html5 internet-explorer windows-7 internet-explorer-9 html5-canvas

这是一个HTML 5 Canvas应用程序。这是一个非常标准的“设计师”应用程序,用户可以将对象添加到布局,移动它们并编辑它们的属性。

它运行良好,但事实证明在Windows 7上的IE 9中存在真正的性能问题。我很感激任何想法!

  • 操作通常需要10秒而不是通常的2秒。

  • 此外,在使用该应用程序一段时间后,浏览器会显示主机“没有响应”的错误消息,提供选项Recover Webpage和X.一旦开始发生,就会发生每个用户操作包括文件菜单,我只能通过编辑URL位置文本来摆脱它。特别是,它通常发生在任何尝试在开发人员工具中使用浏览器的分析器。这显然令人沮丧,但它也可能是一个线索。我想知道是否存在未决的同步AJAX调用,如此错误消息所示,但使用开发人员工具捕获网络流量表明所有调用都已完成。

  • 问题似乎与浏览器和操作系统的这种组合有关。 Windows Server 2008上的IE 9表现良好,Windows 7上的Firefox和Chrome也是如此。对于32位或64位IE,问题是相同的。

  • 这些操作中的大多数也都有服务器端组件。例如,添加文本对象会进行AJAX调用以为对象提供图像。服务器API实现为一个小型TurboGears应用程序,它使用ImageMagick进行图像处理。但粗略的分析表明服务器端没有发生任何异常情况。这表明问题确实存在于JavaScript中。

  • 当应用程序运行时,任务管理器显示使用90%或更高CPU的浏览器。这适用于任何浏览器,而不仅仅是IE 9.这可能是因为应用程序中的渲染循环很紧,所以我们有一个想法是不经常重绘画布。不幸的是,这似乎没有帮助。 requestAnimationFrame似乎是个好主意,但在IE 9中不受支持。

  • 一位同事建议使用Google Chrome Frame插件可能有所帮助。这可能是一个可以接受的解决方案,但我还没有尝试过。

  • 我找到了一些建议来启用“控制面板”选项“使用软件渲染而不是GPU渲染”,但这似乎没有帮助。

1 个答案:

答案 0 :(得分:0)

我注意到的一件事:如果你不在文档中的情况下开始绘制它,那么IE中的画布似乎要慢得多。

所以我画画之前document.body.appendChild(canvasEl)。你甚至可以制作画布元素dislay: none;,但至少应该在画面中。

更新:对于Chrome和Firefox,似乎将画布附加到主体上的速度较慢。因此,如果您不需要将其添加到正文中,请不要将其添加到Chrome和Firefox中。