Canvas Games: Part I - HTML5 Canvas - page 675

Example 8-11. The FrameRateCounter is added
function

function update () {
x = x + movingX ;
y = y + movingY ;
frameRateCounter . countFrames ();

}

function function render () {

// draw background and text
context . fillStyle = '#000000' ;
context . fillRect ( 0 , 0 , 200 , 200 );
context . fillStyle = '#ffffff' ;
context . font = '20px sans-serif' ;
context . textBaseline = 'top' ;
context . fillText ( "FPS:" + frameRateCounter . lastFrameCount , 0 , 180 );

//...Leave everything else from Example 8-10 intact here

}

frameRateCounter = new new FrameRateCounter ();

const const FRAME_RATE = 40 ;

var var intervalTime = 1000 / FRAME_RATE ;

gameLoop ();

function function gameLoop () {

runGame ();
window . setTimeout ( gameLoop , intervalTime );

}