Run results for: canvas2d.drawImage(imageElement) vs createImageBitmap(imageElement)

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:135.0) Gecko/20100101 Firefox/135.0

Browser: Firefox 135

Operating system: Mac OS X 10.15

Device Platform: Desktop

Date tested: one year ago

createImageBitmap(imageElement)

97K/s

canvas2d.drawImage(imageElement)

0/s

View exact numbers

Test name	Executions per second
✓ createImageBitmap(imageElement)	96,672 Ops/sec
canvas2d.drawImage(imageElement)	0 Ops/sec

Script Preparation code:

var img = new Image();
var canvas = document.createElement('canvas');
var isReady = false;

var frameRaw1 = null;
var frameRaw2 = null;

img.addEventListener('load', function() {
    createImageBitmap(img).then(function(imageBitmap) {
      frameRaw2 = imageBitmap;
      canvas.width = frameRaw2.width;
      canvas.height = frameRaw2.height;
      frameRaw1 = canvas.getContext('2d');
      isReady = true;
	});
});

img.src = 'https://media.discordapp.net/attachments/447410261289205781/574359442913492992/unknown.png';

Tests:

canvas2d.drawImage(imageElement)
frameRaw1.clearRect(0, 0, canvas.width, canvas.height); frameRaw1.drawImage(img, 0, 0);
createImageBitmap(imageElement)
createImageBitmap(img).then(function(imageBitmap) { frameRaw2 = imageBitmap; });