← all demos

Stats

Performance counters, after rStats, wired to signals. createStats makes timers, framerate and counters that are signals, so any control takes them; addGraph plots one over time, or several stacked to show where a frame went.

<stats-graph> on its own — no panel, fed by a function

The counters

The loop

panel.js
Try: push Extra work per frame up until the frame graph crosses its dashed line — the reading turns warm at the same moment. The Breakdown graph shows the same milliseconds split between move, bounce, clear and paint, so you can see which phase took them. Then fold the Budget section: the graphs stop drawing entirely while they are out of sight, which is the whole point of a monitor.