diff --git a/examples/README.md b/examples/README.md index 669edb5c..cd159900 100644 --- a/examples/README.md +++ b/examples/README.md @@ -47,7 +47,9 @@ pnpm watch - `resolution` (number, default: 720) - Resolution (height) of to render the test at (in logical pixels) - `fps` (boolean, default: "false") - - Whether or not to log the latest FPS to the console every 1 second. + - Whether or not to log the latest FPS sample to the console every 1 second. + - After skipping the first 10 samples, every 100 samples after that will result + in a statistics summary printed to the console. - `ppr` (number, default: 1) - Device physical pixel ratio. - `multiplier` (number, default: 1) diff --git a/examples/index.ts b/examples/index.ts index b6524b4b..a2dbeb6a 100644 --- a/examples/index.ts +++ b/examples/index.ts @@ -211,8 +211,55 @@ async function initRenderer( driver, ); + /** + * FPS sample captured + */ + const fpsSamples: number[] = []; + /** + * Number of samples to capture before calculating FPS stats + */ + const fpsSampleCount = 100; + /** + * Number of samples to skip before starting to capture FPS samples. + */ + const fpsSampleSkipCount = 10; + /** + * FPS sample index + */ + let fpsSampleIndex = 0; + let fpsSamplesLeft = fpsSampleCount; renderer.on('fpsUpdate', (target: RendererMain, fps: number) => { - console.log(`FPS: ${fps}`); + const captureSample = fpsSampleIndex >= fpsSampleSkipCount; + if (captureSample) { + fpsSamples.push(fps); + fpsSamplesLeft--; + if (fpsSamplesLeft === 0) { + const sortedSamples = fpsSamples.sort((a, b) => a - b); + const averageFps = + fpsSamples.reduce((a, b) => a + b, 0) / fpsSamples.length; + const p01Fps = sortedSamples[Math.floor(fpsSamples.length * 0.01)]!; + const p05Fps = sortedSamples[Math.floor(fpsSamples.length * 0.05)]!; + const p25Fps = sortedSamples[Math.floor(fpsSamples.length * 0.25)]!; + const medianFps = sortedSamples[Math.floor(fpsSamples.length * 0.5)]!; + const stdDevFps = Math.sqrt( + fpsSamples.reduce((a, b) => a + (b - averageFps) ** 2, 0) / + fpsSamples.length, + ); + console.log(`---------------------------------`); + console.log(`Average FPS: ${averageFps}`); + console.log(`Median FPS: ${medianFps}`); + console.log(`P01 FPS: ${p01Fps}`); + console.log(`P05 FPS: ${p05Fps}`); + console.log(`P25 FPS: ${p25Fps}`); + console.log(`Std Dev FPS: ${stdDevFps}`); + console.log(`Num samples: ${fpsSamples.length}`); + console.log(`---------------------------------`); + fpsSamples.length = 0; + fpsSamplesLeft = fpsSampleCount; + } + } + console.log(`FPS: ${fps} (samples left: ${fpsSamplesLeft})`); + fpsSampleIndex++; }); await renderer.init();