JSPM

@pietal.dev/gstats

0.1.6
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 212
  • Score
    100M100P100Q3574F
  • License ISC

Show DrawCalls, FPS, Texture Count on PIXI, Phaser projects

Package Exports

  • @pietal.dev/gstats
  • @pietal.dev/gstats/dist/BaseHooks
  • @pietal.dev/gstats/dist/BaseHooks.js
  • @pietal.dev/gstats/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@pietal.dev/gstats) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

gstatsjs

This is a fork of eXponenta's gstatsjs that can be imported as a ES6 module. Additionally, it can be installed from NPM. More informations here.

It also drops support of Pixi v4 in favor of v5.

# for npm users
npm install @pietal.dev/gstats --save
# alternatively, for yarn users
yarn add @pietal.dev/gstats --save

Graphics statistics (Texture count, DrawPasses) for WebGL applications. Capability with stats.js

Remarks

Due to bug of cacheAsBitmap on Graphics on PIXIv4, TextureCounter incorrectly gets the number of textures.

Currently Draw Calls counter can't work on Phaser 3, because Phaser 3 use DrawArrays for rendering WebGL instead DrawElements. Textures amount for Phaser 2 and 3 is relative value, and may be negative.

Examples

PIXI Stats.js example - show PIXI game Draw Calls and Textures Count statistics by Stas.js.

Phaser 2 CE Stats.js example - show Phaser 2 CE game Draw Calls and Textures Count statistics by Stas.js.

Textures amount for Phaser is relative value, and may be negative.

Phaser 3 Stats.js example - show Phaser 3 Textures Count statistics by Stas.js.

How i can destroy sprite in Phaser 3 with its texture ?

Currently DC can't work, because Phaser 3 use DrawArrays for rendering WebGL. Textures amount for Phaser3 is relative value, and may be negative.

Using

PIXI & Stats.js

var app = new PIXI.Application(options);
var pixiHooks = new GStats.PIXIHooks(app);
var stats = new GStats.StatsJSAdapter(pixiHooks);
document.body.appendChild(stats.stats.dom || stats.stats.domElement);
app.ticker.add(stats.update);

Phaser 2/3 & Stats.js

var game = new Phaser.Game(options);
var phaserHooks = new GStats.PhaserHooks(game);
var stats = new GStats.StatsJSAdapter(phaserHooks);
document.body.appendChild(stats.stats.dom || stats.stats.domElement);

//or other update function
function update() {
  stats.update();
}

PIXI/Phaser & Show stats in app context

coming soon...

Raw WebGL & Stats.js

var gl = // WebGL2RenderingContext;
var baseHooks = new GStats.BaseHooks();
    baseHooks.attach(gl);
var stats = new GStats.StatsJSAdapter(baseHooks);

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

//or other update function
function update() {
    stats.update();
}

TypeScript

Go to index.d.ts