jsPerf.app is an online JavaScript performance benchmark test runner & jsperf.com mirror. It is a complete rewrite in homage to the once excellent jsperf.com now with hopefully a more modern & maintainable codebase.
jsperf.com URLs are mirrored at the same path, e.g:
https://jsperf.com/negative-modulo/2
Can be accessed at:
https://jsperf.app/negative-modulo/2
Tests different methods of manipulating pixels using the canvas. *Removed non-performant fillRect & 1px canvas, renamed snippets.
<canvas id="canvas" height="256" width="256"></canvas>
//precompute everything to only test raw pixel pushing performance
var canvas = document.getElementById('canvas'),
canvasWidth = canvas.width,
canvasHeight = canvas.height,
ctx = canvas.getContext('2d'),
imageData = ctx.getImageData(0, 0, canvasWidth, canvasHeight),
data = imageData.data,
buf = new ArrayBuffer(data.length),
buf8 = new Uint8ClampedArray(buf),
data32 = new Uint32Array(buf),
pixelsI32 = new Int32Array(data.buffer),
pixelsU32 = new Uint32Array(data.buffer),
view = new DataView(data.buffer),
temp = ctx.createImageData(canvasWidth, canvasHeight),
tempData = temp.data,
r = [],
g = [],
b = [],
a = [],
b32 = [],
v32 = [];
for (var y = 0; y < canvasHeight; y++) {
for (var x = 0; x < canvasWidth; x++) {
var red = x * y & 0xff,
green = x & 0xff,
blue = y & 0xff,
alpha = 255;
r.push(red);
g.push(green);
b.push(blue);
a.push(alpha);
b32.push((alpha << 24) | (blue << 16) | (green << 8) | red);
v32.push((red << 24) | (green << 16) | (blue << 8) | alpha);
}
}
var mr = r[0],
mg = g[0],
mb = b[0],
ma = a[0],
mb32 = b32[0],
mv32 = v32[0];
Ready to run.
Test | Ops/sec | |
---|---|---|
putImageData Ref |
| ready |
putImageData Direct |
| ready |
putImageData Temp |
| ready |
32-bit Set |
| ready |
32-bit Direct |
| ready |
32-bit Uint |
| ready |
32-bit DataView |
| ready |
putImageData Ref Mono |
| ready |
putImageData Direct Mono |
| ready |
putImageData Temp Mono |
| ready |
32-bit Set Mono |
| ready |
32-bit Direct Mono |
| ready |
32-bit Uint Mono |
| ready |
32-bit DataView Mono |
| ready |
You can edit these tests or add more tests to this page by appending /edit to the URL.