Shows FPS, frame intervals, and performance info. Phaser 2/CE
Shows FPS, frame intervals, draw count, and other performance info. Demo
game.plugins.add(Phaser.Plugin.AdvancedTiming);
// or
game.plugins.add(Phaser.Plugin.AdvancedTiming, {mode: 'graph'});
The display modes are domMeter
, domText
, graph
, meter
, and text
. The default mode is text
.
You can save a reference to switch modes later:
var plugin = game.plugins.add(Phaser.Plugin.AdvancedTiming);
// …
plugin.mode = 'text';
The plugin also provides two debug methods:
game.debug.gameInfo(x, y);
game.debug.gameTimeInfo(x, y);
Beware that debug display can be slow in WebGL.
plugin.mode = 'domText';
plugin.mode = 'text';
Both show FPS, render type, and WebGL draw count.
text
is drawn on the game canvas. domText
is a separate HTML element.
The domText
element can be styled as
.ppat-text {
position: absolute;
left: 0;
top: 0;
margin: 0;
font: 16px/1 monospace;
}
plugin.mode = 'domMeter';
Shows FPS. It can be styled as
.ppat-fps {
position: absolute;
left: 0;
top: 0;
}
plugin.mode = 'graph';
Plots values for the last 60 updates:
plugin.mode = 'meter';
Shows FPS (blue), update duration (orange), and render duration (violet).
game.debug.gameInfo(x, y);
game.debug.gameTimeInfo(x, y);
Prints values for
game._lastCount
: “how many ‘catch-up’ iterations were used on the logic update last frame”game._spiraling
: “if the ‘catch-up’ iterations are spiraling out of control, this counter is incremented”Prints values for