interface StatsCoreOptions { trackGPU?: boolean; trackCPT?: boolean; trackHz?: boolean; trackFPS?: boolean; logsPerSecond?: number; graphsPerSecond?: number; samplesLog?: number; samplesGraph?: number; precision?: number; } interface QueryInfo { query: WebGLQuery; } interface AverageData { logs: number[]; graph: number[]; } interface InfoData { render: { timestamp: number; }; compute: { timestamp: number; }; } interface StatsData { fps: number; cpu: number; gpu: number; gpuCompute: number; isWorker?: boolean; } declare class StatsCore { trackGPU: boolean; trackHz: boolean; trackFPS: boolean; trackCPT: boolean; samplesLog: number; samplesGraph: number; precision: number; logsPerSecond: number; graphsPerSecond: number; gl: WebGL2RenderingContext | null; ext: any | null; info?: InfoData; gpuDevice: GPUDevice | null; gpuBackend: any | null; renderer: any | null; protected activeQuery: WebGLQuery | null; protected gpuQueries: QueryInfo[]; protected threeRendererPatched: boolean; protected webgpuNative: boolean; protected gpuQuerySet: GPUQuerySet | null; protected gpuResolveBuffer: GPUBuffer | null; protected gpuReadBuffers: GPUBuffer[]; protected gpuWriteBufferIndex: number; protected gpuFrameCount: number; protected pendingResolve: Promise | null; protected beginTime: number; protected prevCpuTime: number; protected frameTimes: number[]; protected frameTimesHead: number; protected renderCount: number; protected cpuStartTime: number; protected totalCpuDuration: number; protected totalGpuDuration: number; protected totalGpuDurationCompute: number; averageFps: AverageData; averageCpu: AverageData; averageGpu: AverageData; averageGpuCompute: AverageData; protected prevGraphTime: number; protected prevTextTime: number; constructor({ trackGPU, trackCPT, trackHz, trackFPS, logsPerSecond, graphsPerSecond, samplesLog, samplesGraph, precision }?: StatsCoreOptions); init(canvasOrGL: WebGL2RenderingContext | HTMLCanvasElement | OffscreenCanvas | GPUDevice | any): Promise; protected handleNativeWebGPU(device: any): boolean; protected initializeWebGPUTiming(): void; protected handleThreeRenderer(renderer: any): boolean; protected handleWebGPURenderer(renderer: any): Promise; protected onWebGPUTimestampSupported(): void; protected initializeWebGL(canvasOrGL: WebGL2RenderingContext | HTMLCanvasElement | OffscreenCanvas): boolean; protected initializeGPUTracking(): void; protected onGPUTrackingInitialized(): void; /** * Get timestampWrites configuration for WebGPU render pass. * Use this when creating your render pass descriptor. * @returns timestampWrites object or undefined if not tracking GPU */ getTimestampWrites(): GPURenderPassTimestampWrites | undefined; begin(encoder?: GPUCommandEncoder): void; end(encoder?: GPUCommandEncoder): void; /** * Resolve WebGPU timestamp queries. Call this after queue.submit(). * Returns a promise that resolves to the GPU duration in milliseconds. */ resolveTimestampsAsync(): Promise; private _resolveTimestamps; protected processGpuQueries(): void; protected processWebGPUTimestamps(): void; protected beginProfiling(): void; protected endProfiling(): void; protected calculateFps(): number; protected updateAverages(): void; protected addToAverage(value: number, averageArray: { logs: any; graph: any; }): void; protected resetCounters(): void; getData(): StatsData; protected patchThreeWebGPU(renderer: any): void; protected patchThreeRenderer(renderer: any): void; /** * Dispose of all resources. Call when done using the stats instance. */ dispose(): void; } declare class Panel { canvas: HTMLCanvasElement; context: CanvasRenderingContext2D | null; name: string; fg: string; bg: string; gradient: CanvasGradient | null; id: number; PR: number; WIDTH: number; HEIGHT: number; TEXT_X: number; TEXT_Y: number; GRAPH_X: number; GRAPH_Y: number; GRAPH_WIDTH: number; GRAPH_HEIGHT: number; constructor(name: string, fg: string, bg: string); private createGradient; initializeCanvas(): void; update(value: number, maxValue: number, decimals?: number, suffix?: string): void; updateGraph(valueGraph: number, maxGraph: number): void; } declare class PanelTexture extends Panel { private currentBitmap; private sourceAspect; constructor(name: string); initializeCanvas(): void; private drawLabelOverlay; /** * Set the source texture aspect ratio for proper display * @param width - Source texture width * @param height - Source texture height */ setSourceSize(width: number, height: number): void; updateTexture(bitmap: ImageBitmap): void; setLabel(label: string): void; update(_value: number, _maxValue: number, _decimals?: number, _suffix?: string): void; updateGraph(_valueGraph: number, _maxGraph: number): void; /** * Dispose of resources */ dispose(): void; } declare class TextureCaptureWebGL { private gl; private previewFbo; private previewTexture; private pixels; private flippedPixels; private previewWidth; private previewHeight; constructor(gl: WebGL2RenderingContext, width?: number, height?: number); /** * Resize preview dimensions */ resize(width: number, height: number): void; private initResources; capture(source: WebGLFramebuffer | null, sourceWidth: number, sourceHeight: number, _sourceId?: string): Promise; private flipY; removeSource(_sourceId: string): void; dispose(): void; } declare class TextureCaptureWebGPU { private device; private previewTexture; private stagingBuffer; private blitPipeline; private sampler; private bindGroupLayout; private initialized; private previewWidth; private previewHeight; private pixelsBuffer; constructor(device: GPUDevice, width?: number, height?: number); /** * Resize preview dimensions */ resize(width: number, height: number): void; private createSizeResources; private initResources; capture(source: GPUTexture): Promise; dispose(): void; } interface ThreeTextureSource { isWebGLRenderTarget?: boolean; __webglFramebuffer?: WebGLFramebuffer; width?: number; height?: number; isRenderTarget?: boolean; texture?: { isTexture?: boolean; }; } interface StatsProfilerOptions extends StatsCoreOptions { } declare class StatsProfiler extends StatsCore { private textureCaptureWebGL; private textureCaptureWebGPU; constructor(options?: StatsProfilerOptions); update(): void; getData(): StatsData; /** * Capture a texture/render target to ImageBitmap for transfer to main thread * @param source - Three.js RenderTarget, GPUTexture, or WebGLFramebuffer with dimensions * @param sourceId - Unique identifier for this texture source (for per-source PBO buffering) * @returns ImageBitmap suitable for postMessage transfer */ captureTexture(source: ThreeTextureSource | { framebuffer: WebGLFramebuffer; width: number; height: number; } | any, sourceId?: string): Promise; /** * Dispose texture capture resources */ disposeTextureCapture(): void; /** * Dispose of all resources */ dispose(): void; } /** * TSL Node capture utilities for stats-gl * * For WebGPU TSL node capture with proper Node integration, use the addon: * import { statsGL } from 'stats-gl/addons/StatsGLNode.js'; * * This file provides a simpler capture system that doesn't require * extending Three.js Node class. */ interface StatsGLNodeData { canvas: HTMLCanvasElement | OffscreenCanvas; canvasTarget: any; quad: any; material: any; node: any; } /** * Manages TSL node capture for stats-gl (used internally) */ declare class StatsGLCapture { nodes: Map; width: number; height: number; private THREE; constructor(THREE: any, width?: number, height?: number); /** * Update capture dimensions (e.g., on resize) */ resize(width: number, height: number): void; register(name: string, targetNode: any): StatsGLNodeData; capture(name: string, renderer: any): Promise; remove(name: string): void; /** * Dispose all capture resources */ dispose(): void; } interface StatsOptions extends StatsCoreOptions { minimal?: boolean; horizontal?: boolean; mode?: number; } declare class Stats extends StatsCore { dom: HTMLDivElement; mode: number; horizontal: boolean; minimal: boolean; private _panelId; private fpsPanel; private msPanel; private gpuPanel; private gpuPanelCompute; private vsyncPanel; private workerCpuPanel; texturePanels: Map; private texturePanelRow; private textureCaptureWebGL; private textureCaptureWebGPU; private textureSourcesWebGL; private textureSourcesWebGPU; private texturePreviewWidth; private texturePreviewHeight; private lastRendererWidth; private lastRendererHeight; private textureUpdatePending; private updateCounter; private lastMin; private lastMax; private lastValue; private readonly VSYNC_RATES; private detectedVSync; private frameTimeHistory; private readonly HISTORY_SIZE; private readonly VSYNC_THRESHOLD; private lastFrameTime; private externalData; private hasNewExternalData; private isWorker; private averageWorkerCpu; static Panel: typeof Panel; static PanelTexture: typeof PanelTexture; constructor({ trackGPU, trackCPT, trackHz, trackFPS, logsPerSecond, graphsPerSecond, samplesLog, samplesGraph, precision, minimal, horizontal, mode }?: StatsOptions); private initializeDOM; private setupEventListeners; private handleClick; private handleResize; /** * Compute and update texture preview dimensions based on renderer aspect ratio */ private updateTexturePreviewDimensions; protected onWebGPUTimestampSupported(): void; protected onGPUTrackingInitialized(): void; setData(data: StatsData): void; update(): void; private updateFromExternalData; private updateFromInternalData; private renderPanels; protected resetCounters(): void; resizePanel(panel: Panel): void; addPanel(panel: Panel): Panel; showPanel(id: number): void; /** * Add a new texture preview panel * @param name - Label for the texture panel * @returns The created PanelTexture instance */ addTexturePanel(name: string): PanelTexture; /** * Set texture source for a panel (Three.js render target) * Auto-detects WebGL/WebGPU and extracts native handles * @param name - Panel name * @param source - Three.js RenderTarget or native texture */ setTexture(name: string, source: ThreeTextureSource | any): void; /** * Set WebGL framebuffer source with explicit dimensions * @param name - Panel name * @param framebuffer - WebGL framebuffer * @param width - Texture width * @param height - Texture height */ setTextureWebGL(name: string, framebuffer: WebGLFramebuffer, width: number, height: number): void; /** * Set texture from ImageBitmap (for worker mode) * @param name - Panel name * @param bitmap - ImageBitmap transferred from worker * @param sourceWidth - Optional source texture width for aspect ratio * @param sourceHeight - Optional source texture height for aspect ratio */ setTextureBitmap(name: string, bitmap: ImageBitmap, sourceWidth?: number, sourceHeight?: number): void; /** * Remove a texture panel * @param name - Panel name to remove */ removeTexturePanel(name: string): void; /** * Capture and update all texture panels * Called automatically during renderPanels at graphsPerSecond rate */ private updateTexturePanels; /** * Capture StatsGL nodes registered by the addon */ private captureStatsGLNodes; private detectVSync; private updatePanelComponents; updatePanel(panel: { update: any; updateGraph: any; name: string; } | null, averageArray: { logs: number[]; graph: number[]; }, precision?: number): void; get domElement(): HTMLDivElement; /** * Dispose of all resources. Call when done using Stats. */ dispose(): void; } export { PanelTexture, StatsData, StatsGLCapture, StatsProfiler, TextureCaptureWebGL, TextureCaptureWebGPU, Stats as default };