stats.js

JavaScript Performance Monitor

This class is a rework of the original stats.js from mrdoob.

It use a single canvas unlike the original that use DOM elements.

So, it 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)
• PING Milliseconds needed to ask request something to the server. The lower the number the better.

Screenshots

NPM

	npm install @jordandelcros/stats-js

Usage

Stats([realTime]);

var stats = new Stats(false);

document.body.appendChild(stats.domElement););

function update() {

  window.requestAnimationFrame(update);

	stats.begin();

	// monitored code goes here

	stats.end();

};

window.requestAnimationFrame(update);

to get the PING you need to call special methods into server's requests:

// ...

function fakeServerRequest(){

	// Call on server request send
	stats.beginPing();

	// Fake server latency
	setTimeout(function(){

		// Call on server request response
		stats.endPing();
		fakeServerRequest();

	}, 65);

};

fakeServerRequest();

// ...