html5 <canvas> 在 Opera 11 上非常慢？

【问题标题】：html5 <canvas> extremely slow on Opera 11?html5 <canvas> 在 Opera 11 上非常慢？
【发布时间】：2011-06-11 18:46:54
【问题描述】：

我们使用 html5 的元素 + JavaScript 实现了图形绘制。 View it here.

它适用于 Chrome 12、Firefox 3.6 和 4 以及 Opera 11。

在与鼠标交互（悬停和滚动以缩放）或使用图形控件切换属性时，Chrome 和 Firefox 中的绘图速度很好。但在 Opera 11.11 中，重绘需要很长时间。我在两台不同的机器上进行了尝试，一台使用 Windows，另一台使用 Linux。

任何想法为什么会这样？或者我怎样才能找出问题所在？

【问题讨论】：

您可能想阅读这篇文章，看看探查器代码是否可以帮助您发现减速的地方。 webmasterkb.com/Uwe/Forum.aspx/opera/6346/…
感谢您的提示 - 我会给您一个支持，但您发布的不是答案而是评论。
很高兴您发现了问题。我没有答案，这就是为什么它是评论，但它指导了你的目标。

标签： javascript html canvas opera

【解决方案1】：

使用context.globalCompositeOperation = "destination-over"; 填充每个路径在 Opera 中大约 200 层中的每一层需要 35 毫秒。

幸运的是，我有一种方法可以在不破坏视觉效果的情况下使用 context.globalCompositeOperation = "source-over";，从而使速度更接近 Firefox 和 Chrome 中的速度。

通过使用以下两行代码，我发现 James Black 发布了一个链接：

time=new Date().getTime(); //this line before the code block to test
//code block under test
time=new Date().getTime() - time; opera.postError(time +'ms'); //this line after the code block to test

请注意，Chrome (Webkit) 已经内置了 JavaScript 分析器，并且在 Firefox 中，Firebug 扩展也允许轻松分析。但我没有发现 Opera 有类似的东西。

【讨论】：