on-screen-vs-off (v5)

Revision 5 of this benchmark created on

Preparation HTML

<canvas id="canvas1" width="500" height="500"></canvas>

<script>
var can = document.getElementById('canvas1');
var ctx = can.getContext('2d');
var img = new Image();
img.src = "http://www.freegaming.de/components/images/8309923658.jpg";
var width=0;
var height=0;
img.onload = function() {
  ctx.drawImage(img, 0, 0);
width=img.width;
height=img.height;
}

</script>

Setup

ctx.clearRect(0,0,500,500);

Test runner

Ready to run.

Testing in
TestOps/sec
off screen
var x = 900;
var y = 900;

ctx.drawImage(img, x,y);
ready
check before offscreen
var x = 900;
var y = 900;
var draw = true;
if(x+width<0||y+height<0||x>200||y>200) draw = false;

if(draw)
ctx.drawImage(img, x,y);
ready
on screen
var x = 0;
var y = 0;

ctx.drawImage(img, x,y);
ready

Revisions

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