import { default as React } from 'react'; /** * Render phase type */ export type RenderPhase = 'render' | 'commit' | 'layout-effect' | 'effect'; /** * Render reason for re-renders */ export type RenderReason = 'initial' | 'props-change' | 'state-change' | 'context-change' | 'parent-render' | 'hooks-change' | 'force-update' | 'unknown'; /** * Single render entry */ export interface RenderEntry { readonly id: string; readonly componentName: string; readonly componentId: string; readonly phase: RenderPhase; readonly duration: number; readonly startTime: number; readonly endTime: number; readonly isInitial: boolean; readonly reason: RenderReason; readonly propsChanged?: string[]; readonly stateChanged?: string[]; readonly isWasted: boolean; readonly parentId?: string; readonly depth: number; readonly timestamp: number; } /** * Component render statistics */ export interface ComponentRenderStats { readonly componentName: string; readonly totalRenders: number; readonly initialRenders: number; readonly reRenders: number; readonly wastedRenders: number; readonly wastedRenderRate: number; readonly totalRenderTime: number; readonly averageRenderTime: number; readonly minRenderTime: number; readonly maxRenderTime: number; readonly p50RenderTime: number; readonly p95RenderTime: number; readonly isSlowComponent: boolean; readonly lastRenderTime: number; readonly rendersByReason: Record; } /** * Render waterfall entry for visualization */ export interface RenderWaterfallEntry { readonly id: string; readonly componentName: string; readonly startOffset: number; readonly duration: number; readonly depth: number; readonly phase: RenderPhase; readonly isWasted: boolean; readonly children: RenderWaterfallEntry[]; } /** * Render interaction (user interaction leading to renders) */ export interface RenderInteraction { readonly id: string; readonly name: string; readonly startTime: number; readonly endTime: number; readonly duration: number; readonly renderCount: number; readonly componentCount: number; readonly wastedRenderCount: number; readonly renders: RenderEntry[]; readonly timestamp: number; } /** * Render tracker configuration */ export interface RenderTrackerConfig { /** Maximum render history entries */ readonly maxHistorySize?: number; /** Slow component threshold (ms) */ readonly slowThreshold?: number; /** Wasted render threshold (ms) - renders under this are considered wasted if no visible change */ readonly wastedThreshold?: number; /** Enable profiling in production */ readonly enableInProduction?: boolean; /** Sample rate (0-1) */ readonly sampleRate?: number; /** Callback on slow render */ readonly onSlowRender?: (entry: RenderEntry) => void; /** Callback on wasted render */ readonly onWastedRender?: (entry: RenderEntry) => void; /** Enable debug logging */ readonly debug?: boolean; } /** * Comprehensive render performance tracker */ export declare class RenderTracker { private static instance; private readonly config; private readonly renderHistory; private readonly activeRenders; private readonly componentInstances; private readonly interactions; private currentInteraction; private renderStack; private isEnabled; private readonly isProd; /** * Private constructor for singleton pattern */ private constructor(); /** * Get singleton instance */ static getInstance(config?: RenderTrackerConfig): RenderTracker; /** * Reset singleton instance (for testing) */ static resetInstance(): void; /** * Start tracking a render */ startRender(componentName: string, options?: { componentId?: string; phase?: RenderPhase; isInitial?: boolean; props?: Record; state?: Record; }): () => RenderEntry | null; /** * Start tracking an interaction (e.g., click, input) */ startInteraction(name: string): () => RenderInteraction | null; /** * Get render statistics for a component */ getComponentStats(componentName: string): ComponentRenderStats | null; /** * Get all component statistics */ getAllComponentStats(): ComponentRenderStats[]; /** * Get slow components */ getSlowComponents(): ComponentRenderStats[]; /** * Get components with wasted renders */ getWastedRenderComponents(): ComponentRenderStats[]; /** * Build render waterfall for visualization */ buildWaterfall(options?: { interactionId?: string; startTime?: number; endTime?: number; }): RenderWaterfallEntry[]; /** * Export waterfall as JSON for visualization tools */ exportWaterfallJson(options?: Parameters[0]): string; /** * Get render history */ getHistory(): RenderEntry[]; /** * Get recent renders */ getRecentRenders(count?: number): RenderEntry[]; /** * Get interactions */ getInteractions(): RenderInteraction[]; /** * Clear all history */ clear(): void; /** * Enable tracking */ enable(): void; /** * Disable tracking */ disable(): void; /** * Check if tracking is enabled */ isTrackingEnabled(): boolean; /** * Generate render performance report */ generateReport(): string; /** * End tracking a render */ private endRender; /** * Determine the reason for a render */ private determineRenderReason; /** * Detect if a render was wasted (no meaningful work done) */ private isWastedRender; /** * Get or create component instance ID */ private getOrCreateComponentId; /** * Update component instance tracking */ private updateComponentInstance; /** * End tracking an interaction */ private endInteraction; /** * Trim history to max size */ private trimHistory; /** * Trim interactions to reasonable size */ private trimInteractions; /** * Debug logging */ private log; } /** * Get the singleton RenderTracker instance */ export declare function getRenderTracker(config?: RenderTrackerConfig): RenderTracker; /** * Track a render (convenience function) */ export declare function trackRender(componentName: string, options?: Parameters[1]): ReturnType; /** * Track an interaction (convenience function) */ export declare function trackInteraction(name: string): ReturnType; /** * HOC that wraps a component with render tracking * * @example * ```tsx * const TrackedMyComponent = withRenderTracking(MyComponent, 'MyComponent'); * ``` */ export declare function withRenderTracking

(Component: React.ComponentType

, componentName: string): React.ComponentType

;