Setting individual canvas pixels (v2)

Revision 2 of this benchmark created by Ideal Machine on

Description

Fixed it so that it actually uses the canvas data array

Preparation HTML

<canvas id="c" width="40" height="30"></canvas>
<script>
  var ctx = document.getElementById("c").getContext("2d");
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
fillRect
for (var x = 0; x < 4800; x++) {
 ctx.fillRect(x % 40, Math.floor(x / 40), 1, 1);
}
ready
Image data
var data = ctx.getImageData(0, 0, 40, 30),
    dataArray = data.data;
for (var x = 0; x < 4800; x++) {
 dataArray[3 * x] = 0;
 dataArray[3 * x + 1] = 0;
 dataArray[3 * x + 2] = 0;
}
ctx.putImageData(data, 0, 0);
ready

Revisions

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

  • Revision 1: published by Ideal Machine on
  • Revision 2: published by Ideal Machine on