pixi-stats
TypeScript icon, indicating that this package has built-in type declarations

4.1.1 • Public • Published

pixi-stats

npm version npm downloads per week

JavaScript Performance Monitor

This library provides an 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)
  • DC Draw Calls made within one frame.
  • TC Texture Count used within one frame.
  • CUSTOM User-defined panel support.

Screenshots

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

Live demo

https://prozi.github.io/oneforall/demo/?fps

Usage (pixi.js)

import { Application } from 'pixi.js';
import { Stats } from 'pixi-stats';

const { renderer } = new Application();
const stats = new Stats(renderer);

Usage (three.js)

import { Renderer } from 'three';
import { Stats } from 'pixi-stats';

const renderer = new Renderer();
const stats = new Stats(renderer);

Installation

npm install pixi-stats --save

Set CSS

#stats {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
}

#stats canvas {
  width: max(100px, 10vw, 10vh);
  height: max(60px, 6vh, 6vw);
  user-select: none;
}

Contributors

The credit goes to:

License

MIT

You can buy me a coffee

https://paypal.me/jacekpietal

Package Sidebar

Install

npm i pixi-stats

Weekly Downloads

3,198

Version

4.1.1

License

MIT

Unpacked Size

57.5 kB

Total Files

54

Last publish

Collaborators

  • jacekpietal
  • pietal.dev