stats.js

JavaScript Performance Monitor

Performance
mrdoob/stats.jsmrdoob.github.io/stats.js/stats.js

README

stats.js
========

JavaScript Performance Monitor ####


This class provides a simple info box that will help you monitor your code performance.

FPS Frames rendered in the last second. The higher the number the better.
MS Milliseconds needed to render a frame. The lower the number the better.
MB MBytes of allocated memory. (Run Chrome with --enable-precise-memory-info)
CUSTOM User-defined panel support.


Screenshots ###


fps.png
ms.png
mb.png
custom.png


Installation ###

  1. ``` sh
  2. npm install stats.js
  3. ```

Usage ###


  1. ``` js
  2. var stats = new Stats();
  3. stats.showPanel( 1 ); // 0: fps, 1: ms, 2: mb, 3+: custom
  4. document.body.appendChild( stats.dom );

  6. function animate() {

  8. stats.begin();

  10. // monitored code goes here

  12. stats.end();

  14. requestAnimationFrame( animate );

  16. }

  18. requestAnimationFrame( animate );
  19. ```


Bookmarklet ###


You can add this code to any page using the following bookmarklet:

  1. ``` js
  2. javascript:(function(){var script=document.createElement('script');script.onload=function(){var stats=new Stats();document.body.appendChild(stats.dom);requestAnimationFrame(function loop(){stats.update();requestAnimationFrame(loop)});};script.src='//mrdoob.github.io/stats.js/build/stats.min.js';document.head.appendChild(script);})()
  3. ```