https://github.com/mrdoob/stats.js

JavaScript Performance Monitor
https://github.com/mrdoob/stats.js

Last synced: 10 days ago
JSON representation

JavaScript Performance Monitor

• Host: GitHub
• URL: https://github.com/mrdoob/stats.js
• Owner: mrdoob
• License: mit
• Created: 2010-04-08T11:54:17.000Z (over 14 years ago)
• Default Branch: master
• Last Pushed: 2023-08-20T15:07:10.000Z (about 1 year ago)
• Last Synced: 2024-05-02T06:13:18.683Z (6 months ago)
• Language: JavaScript
• Homepage: http://mrdoob.github.io/stats.js/
• Size: 31.1 MB
• Stars: 8,593
• Watchers: 180
• Forks: 1,202
• Open Issues: 23
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

• awesome-open-source-games - Stats.js - JavaScript performance monitor. (Maps/Hacks/Plugins/Utilities/All of the Things™ / IOS)
• awesome-github-star - stats.js
• awesome-jsgames - stats.js - JavaScript Performance Monitor. (Uncategorized / Uncategorized)

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](https://raw.githubusercontent.com/mrdoob/stats.js/master/files/fps.png)

![ms.png](https://raw.githubusercontent.com/mrdoob/stats.js/master/files/ms.png)

![mb.png](https://raw.githubusercontent.com/mrdoob/stats.js/master/files/mb.png)

![custom.png](https://raw.githubusercontent.com/mrdoob/stats.js/master/files/custom.png)

### Installation ###

```bash

npm install stats.js

```

### Usage ###

```javascript

var stats = new Stats();

stats.showPanel( 1 ); // 0: fps, 1: ms, 2: mb, 3+: custom

document.body.appendChild( stats.dom );

function animate() {

	stats.begin();

	// monitored code goes here

	stats.end();

	requestAnimationFrame( animate );

}

requestAnimationFrame( animate );

```

### Bookmarklet ###

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

```javascript

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='https://mrdoob.github.io/stats.js/build/stats.min.js';document.head.appendChild(script);})()

```