MeasureThat.net

Run results for: drawimage vs putimagedata 3

Go to the benchmark
Run details:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.1 Safari/605.1.15
Safari 14
Mac OS X 10.15.6
Desktop
4 years ago
Test name Executions per second
drawImage 26298.2 Ops/sec
putImageData 228439.6 Ops/sec
HTML Preparation code:
AخA
 
1
<canvas id="canvas" width="1400" height="1400"></canvas>
Script Preparation code:
​x
 
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext("2d");
​
var cacheG = document.createElement('canvas');
var cacheD = cacheG.getContext('2d');
​
cacheG.width = 1200;
cacheG.height = 1200;
​
cacheD.beginPath();
cacheD.fillStyle = '#000';
cacheD.arc(600, 600, 600, 0, Math.PI * 2, true);
cacheD.fill();
​
var d = cacheD.getImageData(0,0,12,12)
Tests:

  • drawImage

     
    ctx.drawImage(cacheG, 6, 6);

  • putImageData

     
    ctx.putImageData(d, 6, 6);