為什么drawImage在Safari中的執行速度比Chrome或Firefox快得多？

Question

我做了一個小小的HTML canvas可視化工具，很有趣，並且我注意到它在Chrome中運行非常糟糕，在Firefox中非常糟糕，但是在Safari（包括iPhone和iPad）中絕對令人驚訝！

誰能解釋為什么？

我認為代碼應該相當簡單，但是基本上我是在為鼠標（或觸摸）位置繪制點，然后使用drawImage將畫布復制到臨時畫布。 從那里我清除了顯示畫布，然后將臨時畫布復制回了4次，但是應用了諸如drawing，旋轉，偏移，透明度和縮放（以及使用一些不同的globalCompositeOperations）之類的一些東西。 因此，總共，在每個循環中drawImage被調用5次。

您可以在此處查看演示： http : //lakenen.com/vis.html

任何見解將不勝感激！

PS。 如果可以，請在iPad上嘗試； 多點觸控非常簡潔:)

Answer 1

由於性能分析器在Safari和Chrome中幾乎相同，因此您應該可以自行確定。 您的演示可以在我的機器上的Safari和Chrome上正常運行。

無論如何，我無法告訴您為什么drawImage在Chrome上比Safari表現更差，僅當圖像無法加載然后被繪制時才如此。 否則，Chrome在Windows上似乎更快。

這是我前一段時間做的一個簡單的jsperf。 看來Chrome 19在我的Windows 7機器上的運行速度是野生動物園的兩倍。