Canvas drawImage Scaling Performance (v2)

Revision 2 of this benchmark created on

Description

Assess performance of scaling images up and down in drawImage.

Preparation HTML

<img id="image" src="http://jsperf.app/favicon.ico" />
<canvas id="canvas" width="32" height="32"></canvas>

Setup

var image = document.getElementById("image"),
      canvas = document.getElementById("canvas"),
      context = canvas.getContext("2d"),
      w = image.width,
      h = image.height;
    
    // clear
    canvas.height = canvas.height;

Test runner

Ready to run.

Testing in
TestOps/sec
Scale Down
context.drawImage(image, 0, 0, w, h, 0, 0, w / 2, h / 2);
ready
Scale Up
context.drawImage(image, 0, 0, w, h, 0, 0, w * 2, h * 2);
ready
Scale Half Up
context.drawImage(image, 0, 0, w, h, 0, 0, w * 1.5, h * 1.5);
 
ready
No Scale
context.drawImage(image, 0, 0, w, h, 0, 0, w, h);
ready
No Scale Short
context.drawImage(image, 0, 0);
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.