textmode.js 0.4.0 → 0.6.0-beta.1

package/dist/types/rendering/webgl/index.d.ts

@@ -1,18 +1,19 @@
-export * from './Framebuffer';
-export * from './Renderer';
-export * from './Shader';
-export * from './ShaderManager';
-export * from './StateCache';
+export * from './core/Framebuffer';
+export * from './core/Renderer';
+export * from './core/Shader';
+export * from './utils/ViewportCache';
+export * from './geometries/immediate/ImmediateQuad';
+export * from './pipeline';
 export { GeometryType } from './types/GeometryTypes';
 export type { IGeometry as IInstancedGeometry, UnitGeometryData, RectangleParams, LineParams, EllipseParams, ArcParams, TriangleParams, BezierCurveParams, GeometryParams } from './types/GeometryTypes';
 export type { RenderContext, } from './types/RenderTypes';
-export type { InstanceData } from './InstanceData';
-export { PackedInstanceData, InstanceAttributeLayout } from './InstanceData';
-export { InstanceBatch } from './InstanceBatch';
+export type { InstanceData } from './batching/InstanceData';
+export { PackedInstanceData, InstanceAttributeLayout } from './batching/InstanceData';
+export { InstanceBatch } from './batching/InstanceBatch';
 export { BaseGeometry } from './geometries/BaseGeometry';
-export { Rectangle } from './geometries/Rectangle';
-export { Line } from './geometries/Line';
-export { Ellipse } from './geometries/Ellipse';
-export { Arc } from './geometries/Arc';
-export { Triangle } from './geometries/Triangle';
-export { BezierCurve } from './geometries/BezierCurve';
+export { Rectangle } from './geometries/2d/Rectangle';
+export { Line } from './geometries/2d/Line';
+export { Ellipse } from './geometries/2d/Ellipse';
+export { Arc } from './geometries/2d/Arc';
+export { Triangle } from './geometries/2d/Triangle';
+export { BezierCurve } from './geometries/2d/BezierCurve';

package/dist/types/rendering/webgl/materials/Material.d.ts

@@ -0,0 +1,26 @@
+import type { GLShader } from '../core/Shader';
+/**
+ * Uniform value types supported by materials
+ */
+export type UniformValue = number | boolean | number[] | number[][] | Float32Array | Int32Array | WebGLTexture;
+/**
+ * Material defines how geometry should be rendered.
+ * Combines a shader program with uniform parameters.
+ *
+ * Materials are immutable once created to enable safe deduplication and caching.
+ */
+export interface Material {
+    /** Unique material identifier for fast comparison */
+    readonly id: number;
+    /** The shader program to use for rendering */
+    readonly shader: GLShader;
+    /** Uniform values to set when using this material (immutable) */
+    readonly uniforms: Readonly<Record<string, UniformValue>>;
+    /** Hash for fast material comparison and deduplication */
+    readonly hash: number;
+    /**
+     * Whether this is a built-in system material (solid color, copy, etc.)
+     * Built-in materials are never disposed when cleaning up user materials.
+     */
+    readonly isBuiltIn: boolean;
+}

package/dist/types/rendering/webgl/materials/MaterialManager.d.ts

@@ -0,0 +1,63 @@
+import type { Material, UniformValue } from './Material';
+import { GLShader } from '../core/Shader';
+/**
+ * Manages material creation, deduplication, and lifecycle.
+ *
+ * Provides:
+ * - Material creation with automatic deduplication
+ * - Built-in materials (solid color, copy, image-to-MRT)
+ * - Transient materials for dynamic uniforms
+ * - Built-in shader management (2D/3D instanced shaders)
+ *
+ * Performance optimizations:
+ * - Material interning: identical materials share the same instance
+ * - Hash-based lookup for O(1) deduplication
+ * - Separate tracking of user vs built-in materials
+ */
+export declare class MaterialManager {
+    private _gl;
+    private _nextMaterialId;
+    private readonly _shader;
+    private readonly _solidColorMaterial;
+    private _materialCache;
+    constructor(gl: WebGL2RenderingContext);
+    /**
+     * Get the default 2D solid-color material.
+     * This material uses the standard instanced MRT shader with per-instance colors.
+     */
+    get $solidColorMaterial(): Material;
+    /**
+     * Create a new material or return an existing one with identical properties.
+     *
+     * Materials are deduplicated based on shader and uniform values.
+     * If a material with the same shader and uniforms already exists, it will be reused.
+     *
+     * @param shader - The shader program to use
+     * @param uniforms - Uniform values to set (will be frozen for immutability)
+     * @param isBuiltIn - Whether this is a built-in system material
+     * @returns A material instance (new or deduplicated)
+     */
+    $createMaterial(shader: GLShader, uniforms?: Record<string, UniformValue>, isBuiltIn?: boolean): Material;
+    /**
+     * Create a transient material that won't be cached.
+     * Useful for one-off materials with dynamic uniforms that change every frame.
+     *
+     * @param shader - The shader program to use
+     * @param uniforms - Uniform values to set
+     * @returns A new material instance (not cached)
+     */
+    $createTransientMaterial(shader: GLShader, uniforms?: Record<string, UniformValue>): Material;
+    /**
+     * Compute a hash for a shader + uniforms combination.
+     * Used for material deduplication.
+     */
+    private _computeHash;
+    /**
+     * Hash a single uniform value based on its type.
+     */
+    private _hashUniformValue;
+    /**
+     * Dispose of all shaders and materials managed by this manager.
+     */
+    $dispose(): void;
+}

package/dist/types/rendering/webgl/materials/index.d.ts

@@ -0,0 +1,2 @@
+export type { Material, UniformValue } from './Material';
+export { MaterialManager } from './MaterialManager';

package/dist/types/rendering/webgl/pipeline/MaterialBatchPipeline.d.ts

@@ -0,0 +1,63 @@
+import type { DrawCommand } from '../types/DrawCommand';
+/**
+ * Material-based rendering pipeline with strict draw order preservation.
+ *
+ * Responsibilities:
+ * - Manages all geometry instances (one per type)
+ * - Batches consecutive commands with the same material + geometry type
+ * - Executes instanced draw calls
+ *
+ * Key principles:
+ * - Batches consecutive commands with the same material + geometry type
+ * - NEVER reorders commands (preserves user draw order)
+ * - Single rendering path for all geometry (no special-casing custom shaders)
+ *
+ * Architecture:
+ * 1. Scan commands in insertion order
+ * 2. Group consecutive runs of same material+type into batches
+ * 3. Render each batch with a single instanced draw call
+ *
+ * Performance:
+ * - Best case: All commands use same material → 1 draw call
+ * - Worst case: Alternating materials → same as unbatched
+ * - Real-world: 50-70% reduction in draw calls
+ */
+export declare class MaterialBatchPipeline {
+    private _gl;
+    private _geometries;
+    private _geometryAttributeCache;
+    constructor(gl: WebGL2RenderingContext);
+    /**
+     * Execute all queued draw commands in strict order.
+     * Batches consecutive commands with same material+type for efficiency.
+     *
+     * @param commands - Draw commands in user-specified order
+     */
+    $execute(commands: Iterable<DrawCommand>): void;
+    /**
+     * Group consecutive commands with the same material + geometry type.
+     * Preserves draw order by never reordering commands.
+     *
+     * Algorithm:
+     * 1. Start with first command as current batch
+     * 2. For each subsequent command:
+     *    - If material OR type differs: flush current batch, start new one
+     *    - Otherwise: add to current batch
+     * 3. Flush final batch
+     *
+     * @param commands - Input draw commands in order
+     * @returns Array of batches to render sequentially
+     */
+    private _batchConsecutive;
+    /**
+     * Render a single batch of commands with the same material and geometry type.
+     * Uses instanced rendering for maximum efficiency.
+     *
+    * @param batch - Batch to render
+     */
+    private _renderBatch;
+    /**
+     * Dispose of pipeline resources (including all geometries).
+     */
+    $dispose(): void;
+}

package/dist/types/rendering/webgl/pipeline/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * WebGL Rendering Pipeline
+ *
+ * This module contains the rendering pipeline architecture that orchestrates
+ * the execution of draw commands through specialized renderers.
+ */
+export { MaterialBatchPipeline } from './MaterialBatchPipeline';

package/dist/types/rendering/webgl/state/RenderState.d.ts

@@ -0,0 +1,143 @@
+/**
+ * Represents a snapshot of the current rendering state
+ */
+export interface IRenderState {
+    _lineWeight: number;
+    _translationX: number;
+    _translationY: number;
+    _translationZ: number;
+    _rotationX: number;
+    _rotationY: number;
+    _rotationZ: number;
+    _character: [number, number, number];
+    _charColor: [number, number, number, number];
+    _cellColor: [number, number, number, number];
+    _flipX: boolean;
+    _flipY: boolean;
+    _invert: boolean;
+    _charRotation: number;
+    _useOrtho: boolean;
+}
+/**
+ * Manages rendering state and provides push/pop functionality for state management.
+ *
+ * Performance optimizations:
+ * - Inlined array copies eliminate function call overhead
+ * - Object pooling for push/pop operations reduces GC pressure
+ * - Direct property assignment maintains V8 hidden classes
+ */
+export declare class RenderState {
+    private _currentLineWeight;
+    private _currentTranslationX;
+    private _currentTranslationY;
+    private _currentTranslationZ;
+    private _rotationX;
+    private _rotationY;
+    private _rotationZ;
+    private _currentCharacter;
+    private _currentCharColor;
+    private _currentCellColor;
+    private _flipHorizontally;
+    private _flipVertically;
+    private _invert;
+    private _charRotation;
+    private _canvasBackgroundColor;
+    private _useOrtho;
+    private _stateStack;
+    private _statePool;
+    /**
+     * Create a new state object with pre-allocated arrays.
+     * Used by the object pool to minimize garbage collection.
+     * @internal Shared with DrawQueue for command slot initialization
+     */
+    static $createStateObject(): IRenderState;
+    /**
+     * Copy current state to target object without allocations.
+     *
+     * Performance-critical path: This is called every push() operation.
+     * Optimizations:
+     * - Direct property assignment (no loops, no function calls)
+     * - Inlined array element copies (avoids copyArray() overhead)
+     * - Sequential memory access pattern for CPU cache efficiency
+     *
+     * @param target - Target state object to receive values
+     * @private
+     */
+    private _copyCurrentToState;
+    /**
+     * Copy state object to current state without allocations.
+     *
+     * Performance-critical path: This is called every pop() operation.
+     * Optimizations:
+     * - Direct property assignment (no loops, no function calls)
+     * - Inlined array element copies (avoids copyArray() overhead)
+     * - Sequential memory access pattern for CPU cache efficiency
+     *
+     * @param source - Source state object to copy from
+     * @private
+     */
+    private _copyStateToCurrents;
+    /**
+     * Save the current rendering state to the state stack.
+     * Uses object pooling to eliminate per-frame allocations and reduce GC pressure.
+     */
+    $push(): void;
+    /**
+     * Restore the most recently saved rendering state from the state stack.
+     * Returns the state object to the pool for reuse.
+     */
+    $pop(): void;
+    /**
+     * Copy current rendering state to a target object without allocations.
+     * Mutates the target's properties and arrays in-place for zero-allocation performance.
+     *
+     * @param target - Pre-allocated state object to copy values into
+     */
+    $copyTo(target: IRenderState): void;
+    $setLineWeight(weight: number): void;
+    /**
+     * Reset transformation matrix to identity and clear translation counters.
+     * Should be called at the start of each frame to prevent accumulation.
+     */
+    $resetTransform(): void;
+    /**
+     * Apply a rotation around the X-axis to the current transformation matrix.
+     * Follows p5.js convention where order matters.
+     * @param degrees Rotation angle in degrees
+     */
+    $setRotationX(degrees: number): void;
+    /**
+     * Apply a rotation around the Y-axis to the current transformation matrix.
+     * Follows p5.js convention where order matters.
+     * @param degrees Rotation angle in degrees
+     */
+    $setRotationY(degrees: number): void;
+    /**
+     * Apply a rotation around the Z-axis to the current transformation matrix.
+     * Follows p5.js convention where order matters.
+     * @param degrees Rotation angle in degrees
+     */
+    $setRotationZ(degrees: number): void;
+    $translate(x?: number, y?: number, z?: number): void;
+    $setTranslationX(pixels: number): void;
+    $setTranslationY(pixels: number): void;
+    $setTranslationZ(pixels: number): void;
+    $setCharacter(character: [number, number, number]): void;
+    $setCharColor(r: number, g?: number, b?: number, a?: number): void;
+    $setCellColor(r: number, g?: number, b?: number, a?: number): void;
+    $setFlipHorizontally(flip: boolean): void;
+    $setFlipVertically(flip: boolean): void;
+    $setInvert(invert: boolean): void;
+    $setCharRotation(rotation: number): void;
+    $setCanvasBackground(r: number, g: number, b: number, a: number): void;
+    $setUseOrtho(useOrtho: boolean): void;
+    get canvasBackgroundColor(): [number, number, number, number];
+    get useOrtho(): boolean;
+    /**
+     * Get the current transformation matrix.
+     * Returns the underlying Float32Array for efficient GPU upload.
+     */
+    get rotationX(): number;
+    get rotationY(): number;
+    get rotationZ(): number;
+}

package/dist/types/rendering/webgl/types/DrawCommand.d.ts

@@ -1,6 +1,7 @@
 import type { GeometryParams, GeometryType } from './GeometryTypes';
-import type { RenderState } from '../RenderState';
-import type { GLShader } from '../Shader';
+import type { IRenderState } from '../state/RenderState';
+import type { GLShader } from '../core/Shader';
+import type { Material } from '../materials/Material';
 export type CustomRectParams = {
     x: number;
     y: number;
@@ -14,5 +15,6 @@ export interface DrawCommand {
     id: number;
     type: GeometryType;
     params: DrawParams;
-    state: RenderState;
+    state: IRenderState;
+    material: Material;
 }

package/dist/types/rendering/webgl/types/GeometryTypes.d.ts

@@ -1,7 +1,7 @@
 /**
  * Core interfaces and types for the instanced geometry system
  */
-import type { InstanceBatch } from '../InstanceBatch';
+import type { InstanceBatch } from '../batching/InstanceBatch';
 /**
  * Geometry types supported by the instanced rendering system
  */
@@ -11,9 +11,16 @@ export declare enum GeometryType {
     ELLIPSE = "ellipse",
     ARC = "arc",
     TRIANGLE = "triangle",
-    BEZIER_CURVE = "bezier_curve",
-    CUSTOM = "custom"
+    BEZIER_CURVE = "bezier_curve"
 }
+/**
+ * Mapping from GeometryType to numeric shader constant.
+ * Must match the constants defined in instanced.vert:
+ * - GEOMETRY_TYPE_FLAT = 2 (rectangle, line, ellipse, triangle)
+ * - GEOMETRY_TYPE_ARC = 3
+ * - GEOMETRY_TYPE_BEZIER = 4
+ */
+export declare const GEOMETRY_TYPE_ID: Record<GeometryType, number>;
 /**
  * Unit geometry vertex data for a specific geometry type
  */
@@ -72,8 +79,6 @@ export interface IGeometry {
  * Parameters for rectangle geometry
  */
 export interface RectangleParams {
-    x: number;
-    y: number;
     width: number;
     height: number;
 }
@@ -91,8 +96,6 @@ export interface LineParams {
  * Parameters for ellipse geometry
  */
 export interface EllipseParams {
-    x: number;
-    y: number;
     width: number;
     height: number;
     startAngle?: number;
@@ -102,11 +105,8 @@ export interface EllipseParams {
 /**
  * Parameters for arc geometry (filled pie segment)
  * Angles are specified in DEGREES and arcs are drawn clockwise from start to stop.
- * x, y specify the center of the arc (consistent with current ellipse implementation).
  */
 export interface ArcParams {
-    x: number;
-    y: number;
     width: number;
     height: number;
     start: number;

package/dist/types/rendering/webgl/types/RenderTypes.d.ts

@@ -1,7 +1,7 @@
 /**
  * Rendering pipeline interfaces and types
  */
-import type { GLShader } from '../Shader';
+import type { GLShader } from '../core/Shader';
 /**
  * Render context containing shader and rendering configuration
  */

package/dist/types/rendering/webgl/utils/GLUtils.d.ts

@@ -0,0 +1,45 @@
+/**
+ * Update a WebGL texture from a canvas or video source.
+ * Handles binding, pixel storage, upload, and unbinding.
+ *
+ * @param gl WebGL2 rendering context
+ * @param texture Target texture to update
+ * @param source Canvas or video element to upload
+ */
+export declare function updateTextureFromSource(gl: WebGL2RenderingContext, texture: WebGLTexture, source: HTMLCanvasElement | HTMLVideoElement): void;
+/**
+ * Configure texture parameters for filtering and wrapping modes.
+ * Must be called with texture already bound to gl.TEXTURE_2D.
+ *
+ * @param gl WebGL2 rendering context
+ * @param minFilter Minification filter (gl.NEAREST or gl.LINEAR)
+ * @param magFilter Magnification filter (gl.NEAREST or gl.LINEAR)
+ * @param wrapS Horizontal wrapping mode (gl.CLAMP_TO_EDGE or gl.REPEAT)
+ * @param wrapT Vertical wrapping mode (gl.CLAMP_TO_EDGE or gl.REPEAT)
+ */
+export declare function setTextureParameters(gl: WebGL2RenderingContext, minFilter: number, magFilter: number, wrapS: number, wrapT: number): void;
+/**
+ * Configure a vertex attribute with pointer and divisor settings.
+ * Handles enable, pointer setup, and divisor configuration in one call.
+ *
+ * @param gl WebGL2 rendering context
+ * @param location Attribute location from shader
+ * @param size Number of components per vertex attribute (1-4)
+ * @param stride Byte offset between consecutive vertex attributes
+ * @param offset Byte offset of the first component in the buffer
+ * @param divisor Number of instances that will pass between updates (0 = per-vertex, 1 = per-instance)
+ * @param type Data type (default: gl.FLOAT)
+ * @param normalized Whether integer data should be normalized (default: false)
+ */
+export declare function setupVertexAttribute(gl: WebGL2RenderingContext, location: number, size: number, stride: number, offset: number, divisor?: number, type?: number, normalized?: boolean): void;
+/**
+ * Allocate or upload data to a buffer (bind → bufferData → unbind pattern).
+ * Ensures proper binding/unbinding sequence for safe buffer operations.
+ *
+ * @param gl WebGL2 rendering context
+ * @param target Buffer binding point (gl.ARRAY_BUFFER or gl.ELEMENT_ARRAY_BUFFER)
+ * @param buffer Target buffer to bind
+ * @param data Data to upload, or size in bytes for allocation
+ * @param usage Usage hint (gl.STATIC_DRAW, gl.DYNAMIC_DRAW, etc.)
+ */
+export declare function uploadBufferData(gl: WebGL2RenderingContext, target: number, buffer: WebGLBuffer, data: AllowSharedBufferSource | number, usage: number): void;

package/dist/types/rendering/webgl/utils/hash.d.ts

@@ -0,0 +1,118 @@
+/**
+ * Generic hashing utilities for creating stable hash codes from various data types.
+ *
+ * These functions are useful for:
+ * - Object deduplication (e.g., materials, shaders)
+ * - Cache keys
+ * - Fast equality comparisons
+ *
+ * Hash algorithm: Simple 32-bit integer hash with good distribution.
+ * Not cryptographically secure, but fast and collision-resistant for typical use cases.
+ */
+/**
+ * Hash a string to a 32-bit integer.
+ * Uses the djb2 algorithm variant.
+ *
+ * @param str - String to hash
+ * @returns 32-bit integer hash
+ *
+ * @example
+ * ```typescript
+ * hashString("hello") // → 99162322
+ * hashString("world") // → 113318802
+ * ```
+ */
+export declare function hashString(str: string): number;
+/**
+ * Hash a number or boolean to an integer.
+ * Booleans are converted to 0/1.
+ *
+ * @param value - Number or boolean to hash
+ * @returns Integer hash
+ *
+ * @example
+ * ```typescript
+ * hashNumber(42)    // → 42
+ * hashNumber(3.14)  // → 3
+ * hashNumber(true)  // → 1
+ * hashNumber(false) // → 0
+ * ```
+ */
+export declare function hashNumber(value: number | boolean): number;
+/**
+ * Hash an array of numbers.
+ * Supports nested arrays (will be flattened).
+ *
+ * @param arr - Array of numbers or nested arrays
+ * @returns Combined hash of all elements
+ *
+ * @example
+ * ```typescript
+ * hashArray([1, 2, 3])           // → computed hash
+ * hashArray([[1, 2], [3, 4]])    // → computed hash (flattened)
+ * ```
+ */
+export declare function hashArray(arr: number[] | number[][]): number;
+/**
+ * Hash a typed array (Float32Array or Int32Array).
+ * For performance, only hashes the first 16 elements for large arrays.
+ *
+ * @param arr - Typed array to hash
+ * @returns Combined hash
+ *
+ * @example
+ * ```typescript
+ * const arr = new Float32Array([1.0, 2.0, 3.0]);
+ * hashTypedArray(arr) // → computed hash
+ * ```
+ */
+export declare function hashTypedArray(arr: Float32Array | Int32Array): number;
+/**
+ * Hash an object by converting it to a string representation.
+ * Uses the object's memory address (toString) as the hash basis.
+ *
+ * This is useful for WebGL objects like textures, buffers, etc.
+ * where identity is more important than value equality.
+ *
+ * @param obj - Object to hash
+ * @returns Hash based on object identity
+ *
+ * @example
+ * ```typescript
+ * const texture = gl.createTexture();
+ * hashObject(texture) // → hash based on texture identity
+ * ```
+ */
+export declare function hashObject(obj: any): number;
+/**
+ * Combine two hash values into a single hash.
+ * Uses a simple but effective combination strategy.
+ *
+ * @param hash1 - First hash value
+ * @param hash2 - Second hash value
+ * @returns Combined hash
+ *
+ * @example
+ * ```typescript
+ * const h1 = hashString("hello");
+ * const h2 = hashString("world");
+ * const combined = combineHashes(h1, h2);
+ * ```
+ */
+export declare function combineHashes(hash1: number, hash2: number): number;
+/**
+ * Hash a record/object by hashing its sorted keys and values.
+ * Keys are sorted to ensure consistent hashing regardless of property order.
+ *
+ * @param record - Record to hash
+ * @param valueHasher - Function to hash each value
+ * @returns Combined hash of all key-value pairs
+ *
+ * @example
+ * ```typescript
+ * const obj = { b: 2, a: 1, c: 3 };
+ * const hash = hashRecord(obj, hashNumber);
+ * // Keys are sorted: a, b, c → consistent hash
+ * ```
+ */
+export declare function hashRecord<T>(record: Record<string, T>, valueHasher: (value: T) => number): number;

package/dist/types/textmode/AnimationController.d.ts

@@ -3,7 +3,6 @@
  * Provides precise frame rate limiting and smooth animation timing.
  */
 export declare class AnimationController {
-    private _frameRateLimit;
     private _frameInterval;
     private _animationFrameId;
     private _lastFrameTime;
@@ -22,60 +21,51 @@ export declare class AnimationController {
      * Start the animation loop with the provided render callback.
      * @param renderCallback Function to call for each frame render
      */
-    start(renderCallback: () => void): void;
+    $start(renderCallback: () => void): void;
     /**
      * Stop the animation loop.
      */
-    stop(): void;
+    $stop(): void;
     /**
      * Pause the animation loop without stopping it completely.
      */
-    pause(): void;
+    $pause(): void;
     /**
      * Resume the animation loop if it was paused.
      * @param renderCallback Function to call for each frame render
      */
-    resume(renderCallback: () => void): void;
+    $resume(renderCallback: () => void): void;
     /**
      * Set or get the frame rate limit.
      * @param fps Optional new frame rate limit. If not provided, returns current measured frame rate.
      * @param renderCallback Required when setting new frame rate and animation is running
      * @returns Current measured frame rate when getting, void when setting
      */
-    frameRate(fps?: number, renderCallback?: () => void): number | void;
+    $frameRate(fps?: number, renderCallback?: () => void): number | void;
     /**
      * Update frame rate measurement. Should be called on each render.
      * Uses a rolling average for smoother frame rate reporting.
      */
-    measureFrameRate(): void;
+    $measureFrameRate(): void;
     /**
      * Check if the animation loop is currently active.
      */
-    get isLooping(): boolean;
-    /**
-     * Get the current frame rate limit.
-     */
-    get frameRateLimit(): number;
+    get $isLooping(): boolean;
     /**
      * Get the current measured frame rate.
      */
-    get currentFrameRate(): number;
+    get $currentFrameRate(): number;
     /**
      * Get the current frame count.
      */
-    get frameCount(): number;
+    get $frameCount(): number;
     /**
      * Set the current frame count.
      */
-    set frameCount(value: number);
+    set $frameCount(value: number);
     /**
      * Increment the frame count by one.
      * Should be called on each render to track total frames rendered.
      */
-    incrementFrame(): void;
-    /**
-     * Reset the frame count to zero.
-     * Useful when restarting animations or resetting state.
-     */
-    resetFrameCount(): void;
+    $incrementFrame(): void;
 }