/* Feel free to play with this over at http://jsfiddle.net/addyo/Y8P6S/1/. You can either use the Chrome DevTools Timeline or FPS counter to confirm if you're hitting a consistent fps. */ // rAF normalization window.requestAnimationFrame = function() { return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.msRequestAnimationFrame || window.oRequestAnimationFrame || function(f) { window.setTimeout(f,1e3/60); } }(); // define a reference to the canvas's 2D context var context = television.getContext('2d'); // create a buffer to hold the pixel data var pixelBuffer = context.createImageData(television.width, television.height); function drawStatic() { var color, data = pixelBuffer.data, index = 0, len = data.length; while (index < len) { // choose a random grayscale color color = Math.floor(Math.random() * 0xff); // red, green and blue are set to the same color // to result in a random gray pixel data[index++] = data[index++] = data[index++] = color; // the fourth multiple is always completely opaque data[index++] = 0xff; // alpha } // flush our pixel buffer to the canvas context.putImageData(pixelBuffer, 0, 0); }; limitLoop(drawStatic, 30);