在Linux canvas上的google chrome中chrome v116中的drawImage比v114慢20倍

kjthegm6  于 2023-09-28  发布在  Go
关注(0)|答案(1)|浏览(92)

更新Chrome到116版本后,HTML画布的drawImage突然慢了20倍:

Chrome/114.0.0.0 - created 300 canvases in 30ms, drawImage in 39ms
Chrome/116.0.0.0 - created 300 canvases in 15ms, drawImage in 817ms

这会使绘制图像的速度慢20倍。我在Ubuntu 22.04 64bit上如果你想测试旧版本的Chrome,你可以从https://www.googleapis.com/download/storage/v1/b/chromium-browser-snapshots/o/Linux_x64%2F1135561%2Fchrome-linux.zip?generation=1682460989187924&alt=media下载
这发生在114和116之间,我找不到115来进一步缩小范围。
下面是最小的测试代码:

// Create 300 canvases 25x25 to show creating canvases did not slow down
var t1 = Date.now(),
  i, can = [],
  o, img, log = '';
for (i = 0; i < 300; i++) {
  o = {};
  o.canvas = document.createElement('canvas');
  o.context = o.canvas.getContext('2d');
  o.canvas.width = 25;
  o.canvas.height = 25;
  can.push(o);
}
log += 'created 300 canvases in ' + (Date.now() - t1) + 'ms, ';
// create one 1000x1000 canvas to be used as source image
t1 = Date.now();
img = {};
img.canvas = document.createElement('canvas');
img.context = img.canvas.getContext('2d');
img.canvas.width = 1000;
img.canvas.height = 1000;
log += 'created big canvas in ' + (Date.now() - t1) + 'ms, ';
// draw image to all 300 canvases
t1 = Date.now();
for (i = 0; i < can.length; i++) {
  can[i].context.drawImage(img.canvas, 0, 0);
}
console.log('drawImage in ', Date.now() - t1);
log += 'drawImage in ' + (Date.now() - t1) + 'ms, ';
log += window.navigator.userAgent + '<br>';
document.body.innerHTML = log;
<pre id="log"></pre>
vltsax25

vltsax251#

此错误已在Chrome/Chromium版本117中修复

相关问题