UNPKG

playcanvas

Version:

Open-source WebGL/WebGPU 3D engine for the web

356 lines (355 loc) 11.1 kB
export type MiniStatsSizeOptions = { /** * - Width of the graph area. */ width: number; /** * - Height of the graph area. */ height: number; /** * - Spacing between graphs. */ spacing: number; /** * - Whether to show graphs. */ graphs: boolean; }; export type MiniStatsProcessorOptions = { /** * - Whether to show the graph. */ enabled: boolean; /** * - Watermark - shown as a line on the graph, useful for displaying a * budget. */ watermark: number; }; export type MiniStatsGraphOptions = { /** * - Display name. */ name: string; /** * - Path to data inside Application.stats. */ stats: string[]; /** * - Number of decimal places (defaults to none). */ decimalPlaces?: number; /** * - Units (defaults to ""). */ unitsName?: string; /** * - Watermark - shown as a line on the graph, useful for displaying * a budget. */ watermark?: number; }; export type MiniStatsOptions = { /** * - Sizes of area to render individual graphs in and * spacing between individual graphs. */ sizes: MiniStatsSizeOptions[]; /** * - Index into sizes array for initial setting. */ startSizeIndex: number; /** * - Refresh rate of text stats in ms. */ textRefreshRate: number; /** * - CPU graph options. */ cpu: MiniStatsProcessorOptions; /** * - GPU graph options. */ gpu: MiniStatsProcessorOptions; /** * - Array of options to render additional graphs based * on stats collected into Application.stats. */ stats: MiniStatsGraphOptions[]; /** * - Minimum size index at which to show GPU pass timing * graphs. Defaults to 1. */ gpuTimingMinSize?: number; /** * - Minimum size index at which to show CPU sub-timing * graphs (script, anim, physics, render). Defaults to 1. */ cpuTimingMinSize?: number; /** * - Minimum size index at which to show VRAM subcategory * graphs. Defaults to 1. */ vramTimingMinSize?: number; }; /** * @typedef {object} MiniStatsSizeOptions * @property {number} width - Width of the graph area. * @property {number} height - Height of the graph area. * @property {number} spacing - Spacing between graphs. * @property {boolean} graphs - Whether to show graphs. */ /** * @typedef {object} MiniStatsProcessorOptions * @property {boolean} enabled - Whether to show the graph. * @property {number} watermark - Watermark - shown as a line on the graph, useful for displaying a * budget. */ /** * @typedef {object} MiniStatsGraphOptions * @property {string} name - Display name. * @property {string[]} stats - Path to data inside Application.stats. * @property {number} [decimalPlaces] - Number of decimal places (defaults to none). * @property {string} [unitsName] - Units (defaults to ""). * @property {number} [watermark] - Watermark - shown as a line on the graph, useful for displaying * a budget. */ /** * @typedef {object} MiniStatsOptions * @property {MiniStatsSizeOptions[]} sizes - Sizes of area to render individual graphs in and * spacing between individual graphs. * @property {number} startSizeIndex - Index into sizes array for initial setting. * @property {number} textRefreshRate - Refresh rate of text stats in ms. * @property {MiniStatsProcessorOptions} cpu - CPU graph options. * @property {MiniStatsProcessorOptions} gpu - GPU graph options. * @property {MiniStatsGraphOptions[]} stats - Array of options to render additional graphs based * on stats collected into Application.stats. * @property {number} [gpuTimingMinSize] - Minimum size index at which to show GPU pass timing * graphs. Defaults to 1. * @property {number} [cpuTimingMinSize] - Minimum size index at which to show CPU sub-timing * graphs (script, anim, physics, render). Defaults to 1. * @property {number} [vramTimingMinSize] - Minimum size index at which to show VRAM subcategory * graphs. Defaults to 1. */ /** * MiniStats is a small graphical overlay that displays realtime performance metrics. By default, * it shows CPU and GPU utilization, frame timings and draw call count. It can also be configured * to display additional graphs based on data collected into {@link AppBase#stats}. */ export class MiniStats { /** * Predefined stat groups that can be included via {@link MiniStats.getDefaultOptions}. Each * key maps to an array of {@link MiniStatsGraphOptions} entries that are inserted after the * 'Frame' stat in the default options. * * @type {Object<string, MiniStatsGraphOptions[]>} * @ignore */ static statPresets: { [x: string]: MiniStatsGraphOptions[]; }; /** * Returns the default options for MiniStats. The default options configure the overlay to * show the following graphs: * * - CPU utilization * - GPU utilization * - Overall frame time * - Draw call count * - Total VRAM usage * * @param {string[]} [extraStats] - Optional array of preset names from * {@link MiniStats.statPresets} to include. The preset stats are inserted after the 'Frame' * entry. Can be: 'gsplats', 'gsplatsCopy'. * @returns {object} The default options for MiniStats. * @example * // default options without extra stats * const options = pc.MiniStats.getDefaultOptions(); * @example * // include gsplat stats * const options = pc.MiniStats.getDefaultOptions(['gsplats', 'gsplatsCopy']); */ static getDefaultOptions(extraStats?: string[]): object; /** * Create a new MiniStats instance. * * @param {AppBase} app - The application. * @param {MiniStatsOptions} [options] - Options for the MiniStats instance. * @example * // create a new MiniStats instance using default options * const miniStats = new pc.MiniStats(app); */ constructor(app: AppBase, options?: MiniStatsOptions); graphRows: Map<any, any>; freeRows: any[]; nextRowIndex: number; sizes: MiniStatsSizeOptions[]; wordAtlas: WordAtlas; _activeSizeIndex: number; /** * Sets the opacity of the MiniStats overlay. * * @type {number} * @ignore */ set opacity(value: number); /** * Gets the opacity of the MiniStats overlay. * * @type {number} * @ignore */ get opacity(): number; /** * Sets the active size index. Setting the active size index will resize the overlay to the * size specified by the corresponding entry in the sizes array. * * @type {number} * @ignore */ set activeSizeIndex(value: number); /** * Gets the active size index. * * @type {number} * @ignore */ get activeSizeIndex(): number; app: AppBase; drawLayer: import("../../index.js").Layer; device: GraphicsDevice; render2d: Render2d; div: HTMLDivElement; width: number; height: number; gspacing: number; clr: number[]; _enabled: boolean; gpuTimingMinSize: number; gpuPassGraphs: Map<any, any>; cpuTimingMinSize: number; cpuGraphs: Map<any, any>; vramTimingMinSize: number; vramGraphs: Map<any, any>; frameIndex: number; textRefreshRate: number; /** * Destroy the MiniStats instance. * * @example * miniStats.destroy(); */ destroy(): void; /** * Gets the overall height of the MiniStats overlay. * * @type {number} * @ignore */ get overallHeight(): number; /** * Sets the enabled state of the MiniStats overlay. * * @type {boolean} */ set enabled(value: boolean); /** * Gets the enabled state of the MiniStats overlay. * * @type {boolean} */ get enabled(): boolean; /** * Create the graphs requested by the user and add them to the MiniStats instance. * * @param {AppBase} app - The application. * @param {GraphicsDevice} device - The graphics device. * @param {object} options - Options for the MiniStats instance. * @private */ private initGraphs; graphs: any[]; texture: Texture; /** * Render the MiniStats overlay. This is called automatically when the `postrender` event is * fired by the application. * * @private */ private render; /** * Resize the MiniStats overlay. * * @param {number} width - The new width. * @param {number} height - The new height. * @param {boolean} showGraphs - Whether to show the graphs. * @private */ private resize; /** * Update the size and position of the MiniStats overlay. This is called automatically when the * `resizecanvas` event is fired by the graphics device. * * @private */ private updateDiv; /** * Called when the graphics device is lost. * * @private */ private loseContext; /** * Update sub-stat graphs (GPU passes or CPU timings). * @param {Map} subGraphs - Map to store graph data (gpuPassGraphs or cpuGraphs) * @param {string} mainGraphName - Name of main graph ('GPU' or 'CPU') * @param {Map<string,number>|Object} stats - Stats data (Map for GPU, object for CPU) * @param {string} statPathPrefix - Prefix for stat path ('gpu' for GPU, 'frame' for CPU) * @param {number} removeAfterFrames - Frames of zero before removal * @private */ private updateSubStats; /** * Allocates a texture row for a graph. Reuses free rows when available. * * @param {Graph} graph - The graph to allocate a row for. * @returns {number} The allocated row index. * @private */ private allocateRow; /** * Frees a texture row when a graph is destroyed. * * @param {Graph} graph - The graph whose row to free. * @private */ private freeRow; /** * Remove all sub-stat graphs from a tracking map when collapsing below a size threshold. * * @param {Map} subGraphs - The sub-graph map to clear. * @param {string} [mainGraphName] - If provided, reset the main graph's graphType. * @param {number} [graphType] - The graphType value to restore on the main graph. * @private */ private clearSubGraphs; /** * Ensures the texture has enough rows. Only grows, never shrinks. * * @param {number} requiredRows - The minimum number of rows needed. * @private */ private ensureTextureHeight; /** * Called when the `postrender` event is fired by the application. * * @private */ private postRender; } import { WordAtlas } from './word-atlas.js'; import type { AppBase } from '../../framework/app-base.js'; import type { GraphicsDevice } from '../../platform/graphics/graphics-device.js'; import { Render2d } from './render2d.js'; import { Texture } from '../../platform/graphics/texture.js';