clip dither test (v6)

Revision 6 of this benchmark created by Sigurd Lerstad on

Preparation HTML

<canvas id="myCanvas" width="32" height="40"></canvas>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
var canvasWidth = canvas.width;
var canvasHeight = canvas.height;

var canvas2 = document.createElement('canvas');
var ctx2 = canvas2.getContext('2d');
canvas2.width = canvasWidth;
canvas2.width = canvasHeight;
ctx2.fillStyle = 'red';
ctx2.fillRect(0, 0, canvasWidth, canvasHeight);

var img = new Image();
img.src = canvas2.toDataURL();

ctx.drawImage(img, 0, 0);
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
no dither
ctx.drawImage(img, 0, 0);
ready
dither
ctx.save();
for (var i = 0; i < canvasWidth; i++) {
  for (var j = 0; j < canvasHeight/2; j++) {
    if (i % 2 == 0) {
      ctx.rect(i, j*2-1, 1, 1);
    } else {
      ctx.rect(i, j*2, 1, 1);
    }
  }
}
ctx.clip();
ctx.drawImage(img, 0, 0);
ctx.restore();
ready

Revisions

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