解决Canvas在Google Chrome 29中崩溃的问题

Work around for Canvas crashing in Google Chrome 29

本文关键字：崩溃 问题 Chrome Canvas Google 解决      更新时间：2023-09-26

有人知道如何防止HTML5画布在Google Chrome 29中崩溃吗。

经过这么多次重新绘制后，画布在Windows Chrome 29上一直崩溃（而不是28或30）。一种简单的复制方式：1.使用Microsoft Windows计算机（在Linux/MAC OS X上不会出现此问题）2.转到：http://www.html5canvastutorials.com/labs/html5-canvas-kineticjs-drag-and-drop-stress-test-with-1000-shapes/3.点击刷新

我在谷歌的Chromium bug跟踪器上发布了这个问题：https://code.google.com/p/chromium/issues/detail?id=280153

但我正在寻找是否有人找到或能想出解决这个问题的办法。

我没能在Chrome 29或Canary 31（Windows）上崩溃。

但关于解决方案：

尝试通过将繁重且耗时的任务拆分为多个部分来分割浏览器上的负载。每个部分都可以用setTimeout调用。

这将给浏览器一些时间来"呼吸"并执行事件队列中的其他事件，这会让浏览器感到高兴。

function heavyTask(callback) {
     var dataForTask;
     function segment1() {
         /* execute one part of heavy task - do something with dataForTask */
         setTimeout(segment2, 11);
     }
     function segment2() {
         /* execute one part of heavy task - do something with dataForTask */
         setTimeout(segment3, 11);
     }
     function segmentN() {
         /* execute one part of heavy task - do something with dataForTask */
         /// DONE!
         callback();
     }
}

理论上，您可以使用值0来表示setTimeout的延迟，但这并不总是有效的（取决于浏览器）。值11接近最小事件循环时间，因此这应该适用于大多数浏览器。

相关文章：