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
Test performance of drawing on canvas vs using a pre-created canvas.
<div id="canvasContainer"></div>
var cache = document.createElement('canvas');
container = document.getElementById('canvasContainer'),
canvas = document.createElement('canvas'),
w = 50,
h = 80;
function _draw(canvas, x, y, w, h) {
var ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(x, y + 4);
ctx.lineTo(x + w - 4, y + 4);
ctx.lineTo(x + w - 4, y + h - 4);
ctx.lineTo(x + 4, y + h - 4);
ctx.lineTo(x + 4, y);
ctx.fillStyle = '#d8d8d8';
ctx.fill();
ctx.lineWidth = 8;
ctx.strokeStyle = '#000000';
ctx.stroke();
ctx.closePath();
ctx.fillStyle = '#ff0000';
ctx.fillRect(x, y, 1, 1);
ctx.fillRect(x + w - 1, y, 1, 1);
ctx.fillRect(x + w - 1, y + h - 1, 1, 1);
ctx.fillRect(x, y + h - 1, 1, 1);
}
canvas.width = 100;
canvas.height = 100;
cache.width = w;
cache.height = h;
_draw(cache, 0, 0, w, h);
container.innerHTML = '';
Ready to run.
Test | Ops/sec | |
---|---|---|
Re-draw shape |
| ready |
Draw from cached image |
| ready |
You can edit these tests or add more tests to this page by appending /edit to the URL.