@grafana/scenes 6.40.0--canary.1278.18560955561.0 → 6.40.0--canary.1265.18596374903.0

package/dist/esm/performance/LongFrameDetector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LongFrameDetector.js","sources":["../../../src/performance/LongFrameDetector.ts"],"sourcesContent":["import { writePerformanceLog } from '../utils/writePerformanceLog';\n\nconst LONG_FRAME_THRESHOLD = 50; // Threshold for both LoAF and manual tracking (ms)\n\nexport interface LongFrameEvent {\n  duration: number; // Frame duration in milliseconds\n  timestamp: number; // When the frame occurred\n  method: 'manual' | 'loaf'; // Which detection method was used\n}\n\nexport type LongFrameCallback = (event: LongFrameEvent) => void;\n\n/**\n * LongFrameDetector is a module for detecting long animation frames.\n *\n * It supports two detection methods with automatic fallback:\n * 1. LoAF API (default when available): Uses Long Animation Frame API with 50ms threshold\n * 2. Manual tracking (fallback): Uses requestAnimationFrame with configurable threshold (default: 50ms)\n *\n * The detector automatically uses LoAF when available for better attribution and performance,\n * falling back to manual tracking for broader browser support.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/Performance_API/Long_animation_frame_timing\n */\nexport class LongFrameDetector {\n  #isTracking = false;\n  #callback: LongFrameCallback | null = null;\n\n  // Manual tracking state\n  #frameTrackingId: number | null = null;\n  #lastFrameTime = 0;\n\n  // LoAF tracking state\n  #loafObserver: PerformanceObserver | null = null;\n\n  /**\n   * Check if LoAF API is available in the browser\n   */\n  private isLoAFAvailable(): boolean {\n    return (\n      typeof PerformanceObserver !== 'undefined' &&\n      PerformanceObserver.supportedEntryTypes &&\n      PerformanceObserver.supportedEntryTypes.includes('long-animation-frame')\n    );\n  }\n\n  /**\n   * Start detecting long frames and call the provided callback when they occur\n   */\n  public start(callback: LongFrameCallback): void {\n    if (this.#isTracking) {\n      writePerformanceLog('LFD', 'Already tracking frames, stopping previous session');\n      this.stop();\n    }\n\n    this.#callback = callback;\n    this.#isTracking = true;\n\n    if (this.isLoAFAvailable()) {\n      this.startLoAFTracking();\n    } else {\n      this.startManualFrameTracking();\n    }\n\n    writePerformanceLog(\n      'LFD',\n      `Started tracking with ${\n        this.isLoAFAvailable() ? 'LoAF API' : 'manual'\n      } method, threshold: ${LONG_FRAME_THRESHOLD}ms`\n    );\n  }\n\n  /**\n   * Stop detecting long frames\n   */\n  public stop(): void {\n    if (!this.#isTracking) {\n      return;\n    }\n\n    this.#isTracking = false;\n    this.#callback = null;\n\n    // Stop both tracking methods to ensure cleanup\n    this.stopLoAFTracking();\n    this.stopManualFrameTracking();\n  }\n\n  /**\n   * Check if currently tracking frames\n   */\n  public isTracking(): boolean {\n    return this.#isTracking;\n  }\n\n  /**\n   * Start tracking using the Long Animation Frame API\n   * @see https://developer.mozilla.org/en-US/docs/Web/API/PerformanceLongAnimationFrameTiming\n   */\n  private startLoAFTracking(): void {\n    if (!this.isLoAFAvailable()) {\n      writePerformanceLog('LFD', 'LoAF API not available, falling back to manual tracking');\n      this.startManualFrameTracking();\n      return;\n    }\n\n    try {\n      this.#loafObserver = new PerformanceObserver((list) => {\n        for (const entry of list.getEntries()) {\n          // No duration check needed - LoAF API already filters for long frames (>50ms)\n          const event: LongFrameEvent = {\n            duration: entry.duration,\n            timestamp: entry.startTime,\n            method: 'loaf',\n          };\n\n          if (this.#callback) {\n            this.#callback(event);\n          }\n\n          // Add performance marks and measurements for debugging in dev tools\n          if (typeof performance !== 'undefined' && performance.mark && performance.measure) {\n            const frameId = `long-frame-${entry.startTime.toFixed(0)}`;\n            const startMarkName = `${frameId}-start`;\n            const endMarkName = `${frameId}-end`;\n            const measureName = `Long Frame (LoAF): ${entry.duration.toFixed(1)}ms`;\n\n            try {\n              // Create start and end marks\n              performance.mark(startMarkName, { startTime: entry.startTime });\n              performance.mark(endMarkName, { startTime: entry.startTime + entry.duration });\n\n              // Create measurement span\n              performance.measure(measureName, startMarkName, endMarkName);\n            } catch {\n              // Fallback for browsers that don't support startTime option\n              performance.mark(measureName);\n            }\n          }\n\n          writePerformanceLog('LFD', `Long frame detected (LoAF): ${entry.duration}ms at ${entry.startTime}ms`);\n        }\n      });\n\n      this.#loafObserver.observe({ type: 'long-animation-frame', buffered: false });\n    } catch (error) {\n      writePerformanceLog('LFD', 'Failed to start LoAF tracking, falling back to manual:', error);\n      this.startManualFrameTracking();\n    }\n  }\n\n  /**\n   * Stop LoAF tracking\n   */\n  private stopLoAFTracking(): void {\n    if (this.#loafObserver) {\n      this.#loafObserver.disconnect();\n      this.#loafObserver = null;\n      writePerformanceLog('LFD', 'Stopped LoAF tracking');\n    }\n  }\n\n  /**\n   * Start manual frame tracking using requestAnimationFrame\n   */\n  private startManualFrameTracking(): void {\n    this.#lastFrameTime = performance.now();\n    this.#frameTrackingId = requestAnimationFrame(() => this.measureFrames());\n  }\n\n  /**\n   * Stop manual frame tracking\n   */\n  private stopManualFrameTracking(): void {\n    if (this.#frameTrackingId) {\n      cancelAnimationFrame(this.#frameTrackingId);\n      this.#frameTrackingId = null;\n      writePerformanceLog('LFD', 'Stopped manual frame tracking');\n    }\n  }\n\n  /**\n   * Measure frame durations using requestAnimationFrame\n   */\n  private measureFrames = (): void => {\n    if (!this.#isTracking) {\n      return;\n    }\n\n    const currentFrameTime = performance.now();\n    const frameLength = currentFrameTime - this.#lastFrameTime;\n\n    // Check if frame exceeds threshold\n    if (frameLength > LONG_FRAME_THRESHOLD) {\n      const event: LongFrameEvent = {\n        duration: frameLength,\n        timestamp: currentFrameTime,\n        method: 'manual',\n      };\n\n      if (this.#callback) {\n        this.#callback(event);\n      }\n\n      // Add performance marks and measurements for debugging in dev tools\n      if (typeof performance !== 'undefined' && performance.mark && performance.measure) {\n        const frameId = `long-frame-manual-${currentFrameTime.toFixed(0)}`;\n        const startMarkName = `${frameId}-start`;\n        const endMarkName = `${frameId}-end`;\n        const measureName = `Long Frame (Manual): ${frameLength.toFixed(1)}ms`;\n\n        try {\n          // Create start and end marks\n          performance.mark(startMarkName, { startTime: currentFrameTime - frameLength });\n          performance.mark(endMarkName, { startTime: currentFrameTime });\n\n          // Create measurement span\n          performance.measure(measureName, startMarkName, endMarkName);\n        } catch {\n          // Fallback for browsers that don't support startTime option\n          performance.mark(measureName);\n        }\n      }\n\n      writePerformanceLog(\n        'LFD',\n        `Long frame detected (manual): ${frameLength}ms (threshold: ${LONG_FRAME_THRESHOLD}ms)`\n      );\n    }\n\n    this.#lastFrameTime = currentFrameTime;\n\n    // Continue tracking\n    if (this.#isTracking) {\n      this.#frameTrackingId = requestAnimationFrame(this.measureFrames);\n    }\n  };\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/performance/PanelProfilingManager.js

@@ -0,0 +1,65 @@
+import { VizPanel } from '../components/VizPanel/VizPanel.js';
+import { VizPanelRenderProfiler } from './VizPanelRenderProfiler.js';
+import { sceneGraph } from '../core/sceneGraph/index.js';
+
+class PanelProfilingManager {
+  constructor(_config) {
+    this._config = _config;
+    this._subscriptions = [];
+  }
+  /**
+   * Attach panel profiling to a scene object
+   */
+  attachToScene(sceneObject) {
+    this._sceneObject = sceneObject;
+    const subscription = sceneObject.subscribeToState((newState, prevState) => {
+      if (this._config.watchStateKey) {
+        if (newState[this._config.watchStateKey] !== prevState[this._config.watchStateKey]) {
+          this._attachProfilersToPanels();
+        }
+      } else {
+        this._attachProfilersToPanels();
+      }
+    });
+    this._subscriptions.push(subscription);
+    this._attachProfilersToPanels();
+  }
+  /**
+   * Attach VizPanelRenderProfiler to a specific panel if it doesn't already have one
+   * @param panel - The VizPanel to attach profiling to
+   */
+  attachProfilerToPanel(panel) {
+    var _a;
+    const existingProfiler = (_a = panel.state.$behaviors) == null ? void 0 : _a.find((b) => b instanceof VizPanelRenderProfiler);
+    if (existingProfiler) {
+      return;
+    }
+    const profiler = new VizPanelRenderProfiler();
+    panel.setState({
+      $behaviors: [...panel.state.$behaviors || [], profiler]
+    });
+  }
+  /**
+   * Attach VizPanelRenderProfiler to all VizPanels that don't already have one
+   */
+  _attachProfilersToPanels() {
+    if (!this._sceneObject) {
+      return;
+    }
+    const panels = sceneGraph.findAllObjects(this._sceneObject, (obj) => obj instanceof VizPanel);
+    panels.forEach((panel) => {
+      this.attachProfilerToPanel(panel);
+    });
+  }
+  /**
+   * Clean up subscriptions and references
+   */
+  cleanup() {
+    this._subscriptions.forEach((sub) => sub.unsubscribe());
+    this._subscriptions = [];
+    this._sceneObject = void 0;
+  }
+}
+
+export { PanelProfilingManager };
+//# sourceMappingURL=PanelProfilingManager.js.map

package/dist/esm/performance/PanelProfilingManager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PanelProfilingManager.js","sources":["../../../src/performance/PanelProfilingManager.ts"],"sourcesContent":["import { Unsubscribable } from 'rxjs';\nimport { VizPanel } from '../components/VizPanel/VizPanel';\nimport { VizPanelRenderProfiler } from './VizPanelRenderProfiler';\nimport { SceneObject } from '../core/types';\nimport { sceneGraph } from '../core/sceneGraph';\n\nexport interface PanelProfilingConfig {\n  watchStateKey?: string; // State property to watch for structural changes (e.g., 'body', 'children')\n}\n\n/**\n * Manages VizPanelRenderProfiler instances for all panels in a scene object.\n * Extracted from DashboardPanelProfilingBehavior to allow composition with SceneRenderProfiler.\n */\nexport class PanelProfilingManager {\n  private _sceneObject?: SceneObject;\n  private _subscriptions: Unsubscribable[] = [];\n\n  public constructor(private _config: PanelProfilingConfig) {}\n\n  /**\n   * Attach panel profiling to a scene object\n   */\n  public attachToScene(sceneObject: SceneObject) {\n    this._sceneObject = sceneObject;\n\n    // Subscribe to scene state changes to add profilers to new panels\n    const subscription = sceneObject.subscribeToState((newState: any, prevState: any) => {\n      // If watchStateKey is specified, only react to changes in that specific property\n      if (this._config.watchStateKey) {\n        if (newState[this._config.watchStateKey] !== prevState[this._config.watchStateKey]) {\n          this._attachProfilersToPanels();\n        }\n      } else {\n        // Fallback: react to any state change\n        this._attachProfilersToPanels();\n      }\n    });\n\n    this._subscriptions.push(subscription);\n\n    // Attach profilers to existing panels\n    this._attachProfilersToPanels();\n  }\n\n  /**\n   * Attach VizPanelRenderProfiler to a specific panel if it doesn't already have one\n   * @param panel - The VizPanel to attach profiling to\n   */\n  public attachProfilerToPanel(panel: VizPanel): void {\n    // Check if profiler already exists\n    const existingProfiler = panel.state.$behaviors?.find((b) => b instanceof VizPanelRenderProfiler);\n\n    if (existingProfiler) {\n      return; // Already has a profiler\n    }\n\n    // Add profiler behavior\n    const profiler = new VizPanelRenderProfiler();\n\n    panel.setState({\n      $behaviors: [...(panel.state.$behaviors || []), profiler],\n    });\n  }\n\n  /**\n   * Attach VizPanelRenderProfiler to all VizPanels that don't already have one\n   */\n  private _attachProfilersToPanels() {\n    if (!this._sceneObject) {\n      return;\n    }\n\n    // Use scene graph to find all VizPanels in the scene\n    const panels = sceneGraph.findAllObjects(this._sceneObject, (obj) => obj instanceof VizPanel) as VizPanel[];\n\n    panels.forEach((panel) => {\n      this.attachProfilerToPanel(panel);\n    });\n  }\n\n  /**\n   * Clean up subscriptions and references\n   */\n  public cleanup() {\n    this._subscriptions.forEach((sub) => sub.unsubscribe());\n    this._subscriptions = [];\n    this._sceneObject = undefined;\n  }\n}\n"],"names":[],"mappings":";;;;AAcO,MAAM,qBAAsB,CAAA;AAAA,EAI1B,YAAoB,OAA+B,EAAA;AAA/B,IAAA,IAAA,CAAA,OAAA,GAAA,OAAA;AAF3B,IAAA,IAAA,CAAQ,iBAAmC,EAAC;AAAA;AAEe;AAAA;AAAA;AAAA,EAKpD,cAAc,WAA0B,EAAA;AAC7C,IAAA,IAAA,CAAK,YAAe,GAAA,WAAA;AAGpB,IAAA,MAAM,YAAe,GAAA,WAAA,CAAY,gBAAiB,CAAA,CAAC,UAAe,SAAmB,KAAA;AAEnF,MAAI,IAAA,IAAA,CAAK,QAAQ,aAAe,EAAA;AAC9B,QAAI,IAAA,QAAA,CAAS,KAAK,OAAQ,CAAA,aAAa,MAAM,SAAU,CAAA,IAAA,CAAK,OAAQ,CAAA,aAAa,CAAG,EAAA;AAClF,UAAA,IAAA,CAAK,wBAAyB,EAAA;AAAA;AAChC,OACK,MAAA;AAEL,QAAA,IAAA,CAAK,wBAAyB,EAAA;AAAA;AAChC,KACD,CAAA;AAED,IAAK,IAAA,CAAA,cAAA,CAAe,KAAK,YAAY,CAAA;AAGrC,IAAA,IAAA,CAAK,wBAAyB,EAAA;AAAA;AAChC;AAAA;AAAA;AAAA;AAAA,EAMO,sBAAsB,KAAuB,EAAA;AAjDtD,IAAA,IAAA,EAAA;AAmDI,IAAM,MAAA,gBAAA,GAAA,CAAmB,WAAM,KAAM,CAAA,UAAA,KAAZ,mBAAwB,IAAK,CAAA,CAAC,MAAM,CAAa,YAAA,sBAAA,CAAA;AAE1E,IAAA,IAAI,gBAAkB,EAAA;AACpB,MAAA;AAAA;AAIF,IAAM,MAAA,QAAA,GAAW,IAAI,sBAAuB,EAAA;AAE5C,IAAA,KAAA,CAAM,QAAS,CAAA;AAAA,MACb,UAAA,EAAY,CAAC,GAAI,KAAA,CAAM,MAAM,UAAc,IAAA,IAAK,QAAQ;AAAA,KACzD,CAAA;AAAA;AACH;AAAA;AAAA;AAAA,EAKQ,wBAA2B,GAAA;AACjC,IAAI,IAAA,CAAC,KAAK,YAAc,EAAA;AACtB,MAAA;AAAA;AAIF,IAAM,MAAA,MAAA,GAAS,WAAW,cAAe,CAAA,IAAA,CAAK,cAAc,CAAC,GAAA,KAAQ,eAAe,QAAQ,CAAA;AAE5F,IAAO,MAAA,CAAA,OAAA,CAAQ,CAAC,KAAU,KAAA;AACxB,MAAA,IAAA,CAAK,sBAAsB,KAAK,CAAA;AAAA,KACjC,CAAA;AAAA;AACH;AAAA;AAAA;AAAA,EAKO,OAAU,GAAA;AACf,IAAA,IAAA,CAAK,eAAe,OAAQ,CAAA,CAAC,GAAQ,KAAA,GAAA,CAAI,aAAa,CAAA;AACtD,IAAA,IAAA,CAAK,iBAAiB,EAAC;AACvB,IAAA,IAAA,CAAK,YAAe,GAAA,MAAA;AAAA;AAExB;;;;"}

package/dist/esm/performance/ScenePerformanceTracker.js

@@ -0,0 +1,78 @@
+let operationCounter = 0;
+function generateOperationId(prefix = "op") {
+  return `${prefix}-${Date.now()}-${++operationCounter}`;
+}
+const _ScenePerformanceTracker = class _ScenePerformanceTracker {
+  constructor() {
+    this.observers = [];
+  }
+  static getInstance() {
+    if (!_ScenePerformanceTracker.instance) {
+      _ScenePerformanceTracker.instance = new _ScenePerformanceTracker();
+    }
+    return _ScenePerformanceTracker.instance;
+  }
+  /**
+   * Register a performance observer
+   */
+  addObserver(observer) {
+    this.observers.push(observer);
+    return () => {
+      const index = this.observers.indexOf(observer);
+      if (index > -1) {
+        this.observers.splice(index, 1);
+      }
+    };
+  }
+  /**
+   * Remove all observers (for testing)
+   */
+  clearObservers() {
+    this.observers = [];
+  }
+  /**
+   * Get current observer count (for debugging)
+   */
+  getObserverCount() {
+    return this.observers.length;
+  }
+  notifyObservers(methodName, data, errorContext) {
+    this.observers.forEach((observer) => {
+      try {
+        const method = observer[methodName];
+        method == null ? void 0 : method(data);
+      } catch (error) {
+        console.warn(`Error in ${errorContext} observer:`, error);
+      }
+    });
+  }
+  notifyDashboardInteractionStart(data) {
+    this.notifyObservers("onDashboardInteractionStart", data, "dashboard interaction start");
+  }
+  notifyDashboardInteractionMilestone(data) {
+    this.notifyObservers("onDashboardInteractionMilestone", data, "dashboard interaction milestone");
+  }
+  notifyDashboardInteractionComplete(data) {
+    this.notifyObservers("onDashboardInteractionComplete", data, "dashboard interaction complete");
+  }
+  notifyPanelOperationStart(data) {
+    this.notifyObservers("onPanelOperationStart", data, "panel operation start");
+  }
+  notifyPanelOperationComplete(data) {
+    this.notifyObservers("onPanelOperationComplete", data, "panel operation complete");
+  }
+  notifyQueryStart(data) {
+    this.notifyObservers("onQueryStart", data, "query start");
+  }
+  notifyQueryComplete(data) {
+    this.notifyObservers("onQueryComplete", data, "query complete");
+  }
+};
+_ScenePerformanceTracker.instance = null;
+let ScenePerformanceTracker = _ScenePerformanceTracker;
+function getScenePerformanceTracker() {
+  return ScenePerformanceTracker.getInstance();
+}
+
+export { ScenePerformanceTracker, generateOperationId, getScenePerformanceTracker };
+//# sourceMappingURL=ScenePerformanceTracker.js.map

package/dist/esm/performance/ScenePerformanceTracker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScenePerformanceTracker.js","sources":["../../../src/performance/ScenePerformanceTracker.ts"],"sourcesContent":["/**\n * Centralized performance tracking system using observer pattern.\n * External systems (like Grafana) implement ScenePerformanceObserver to receive performance events.\n */\n\n/** Generate unique operation IDs for correlating start/complete events */\nlet operationCounter = 0;\nexport function generateOperationId(prefix = 'op'): string {\n  return `${prefix}-${Date.now()}-${++operationCounter}`;\n}\n\n/** Base interface for all performance events */\nexport interface BasePerformanceEvent {\n  operationId: string; // Unique identifier for correlating start/complete events\n  timestamp: number;\n  duration?: number;\n  error?: string;\n}\n\nexport interface DashboardInteractionStartData extends BasePerformanceEvent {\n  interactionType: string;\n  metadata?: Record<string, unknown>;\n}\n\nexport interface DashboardInteractionMilestoneData extends BasePerformanceEvent {\n  interactionType: string;\n  milestone: string;\n  metadata?: Record<string, unknown>;\n}\n\nexport interface DashboardInteractionCompleteData extends BasePerformanceEvent {\n  interactionType: string;\n  networkDuration?: number;\n  longFramesCount: number;\n  longFramesTotalTime: number;\n  metadata?: Record<string, unknown>;\n}\n\n/** Metadata interface for transform operations */\nexport interface TransformMetadata {\n  transformationId: string;\n  transformationCount: number;\n  seriesTransformationCount: number;\n  annotationTransformationCount: number;\n  success?: boolean;\n  error?: string;\n}\n\n/** Metadata interface for query operations */\nexport interface QueryMetadata {\n  queryId: string;\n  queryType: string;\n}\n\n/** Metadata interface for render operations */\nexport interface RenderMetadata {\n  // Empty for now - can be extended later if needed\n}\n\n/** Metadata interface for plugin load operations */\nexport interface PluginLoadMetadata {\n  pluginId: string;\n  fromCache?: boolean;\n  pluginLoadTime?: number;\n}\n\n/** Metadata interface for field config operations */\nexport interface FieldConfigMetadata {}\n\n/** Base interface for panel performance events */\ninterface BasePanelPerformanceData extends BasePerformanceEvent {\n  panelId: string;\n  panelKey: string;\n  pluginId: string;\n  pluginVersion?: string;\n  panelTitle?: string;\n}\n\n/** Transform operation performance data */\nexport interface PanelTransformPerformanceData extends BasePanelPerformanceData {\n  operation: 'transform';\n  metadata: TransformMetadata;\n}\n\n/** Query operation performance data */\nexport interface PanelQueryPerformanceData extends BasePanelPerformanceData {\n  operation: 'query';\n  metadata: QueryMetadata;\n}\n\n/** Render operation performance data */\nexport interface PanelRenderPerformanceData extends BasePanelPerformanceData {\n  operation: 'render';\n  metadata: RenderMetadata;\n}\n\n/** Plugin load operation performance data */\nexport interface PanelPluginLoadPerformanceData extends BasePanelPerformanceData {\n  operation: 'plugin-load';\n  metadata: PluginLoadMetadata;\n}\n\n/** Field config operation performance data */\nexport interface PanelFieldConfigPerformanceData extends BasePanelPerformanceData {\n  operation: 'fieldConfig';\n  metadata: FieldConfigMetadata;\n}\n\n/** Discriminated union of all panel performance data types */\nexport type PanelPerformanceData =\n  | PanelTransformPerformanceData\n  | PanelQueryPerformanceData\n  | PanelRenderPerformanceData\n  | PanelPluginLoadPerformanceData\n  | PanelFieldConfigPerformanceData;\n\n/** Non-panel query performance data for dashboard queries (annotations, variables, etc.) */\nexport interface QueryPerformanceData extends BasePerformanceEvent {\n  queryId: string;\n  queryType: string;\n  origin: string; // e.g., \"AnnotationsDataLayer\", \"QueryVariable\", \"VizPanel/loadPlugin\"\n}\n\n/**\n * Observer interface for performance monitoring\n * External systems implement this to receive performance notifications\n */\nexport interface ScenePerformanceObserver {\n  // Dashboard-level events\n  onDashboardInteractionStart?(data: DashboardInteractionStartData): void;\n  onDashboardInteractionMilestone?(data: DashboardInteractionMilestoneData): void;\n  onDashboardInteractionComplete?(data: DashboardInteractionCompleteData): void;\n\n  // Panel-level events\n  onPanelOperationStart?(data: PanelPerformanceData): void;\n  onPanelOperationComplete?(data: PanelPerformanceData): void;\n\n  // Query-level events\n  onQueryStart?(data: QueryPerformanceData): void;\n  onQueryComplete?(data: QueryPerformanceData): void;\n}\n\n/**\n * Centralized performance tracker\n * Manages observers and provides methods for scene objects to report performance events\n */\nexport class ScenePerformanceTracker {\n  private static instance: ScenePerformanceTracker | null = null;\n  private observers: ScenePerformanceObserver[] = [];\n\n  public static getInstance(): ScenePerformanceTracker {\n    if (!ScenePerformanceTracker.instance) {\n      ScenePerformanceTracker.instance = new ScenePerformanceTracker();\n    }\n    return ScenePerformanceTracker.instance;\n  }\n\n  /**\n   * Register a performance observer\n   */\n  public addObserver(observer: ScenePerformanceObserver): () => void {\n    this.observers.push(observer);\n\n    // Return unsubscribe function\n    return () => {\n      const index = this.observers.indexOf(observer);\n      if (index > -1) {\n        this.observers.splice(index, 1);\n      }\n    };\n  }\n\n  /**\n   * Remove all observers (for testing)\n   */\n  public clearObservers(): void {\n    this.observers = [];\n  }\n\n  /**\n   * Get current observer count (for debugging)\n   */\n  public getObserverCount(): number {\n    return this.observers.length;\n  }\n\n  private notifyObservers<T>(methodName: keyof ScenePerformanceObserver, data: T, errorContext: string): void {\n    this.observers.forEach((observer) => {\n      try {\n        const method = observer[methodName] as ((data: T) => void) | undefined;\n        method?.(data);\n      } catch (error) {\n        console.warn(`Error in ${errorContext} observer:`, error);\n      }\n    });\n  }\n\n  public notifyDashboardInteractionStart(data: DashboardInteractionStartData): void {\n    this.notifyObservers('onDashboardInteractionStart', data, 'dashboard interaction start');\n  }\n\n  public notifyDashboardInteractionMilestone(data: DashboardInteractionMilestoneData): void {\n    this.notifyObservers('onDashboardInteractionMilestone', data, 'dashboard interaction milestone');\n  }\n\n  public notifyDashboardInteractionComplete(data: DashboardInteractionCompleteData): void {\n    this.notifyObservers('onDashboardInteractionComplete', data, 'dashboard interaction complete');\n  }\n\n  public notifyPanelOperationStart(data: PanelPerformanceData): void {\n    this.notifyObservers('onPanelOperationStart', data, 'panel operation start');\n  }\n\n  public notifyPanelOperationComplete(data: PanelPerformanceData): void {\n    this.notifyObservers('onPanelOperationComplete', data, 'panel operation complete');\n  }\n\n  public notifyQueryStart(data: QueryPerformanceData): void {\n    this.notifyObservers('onQueryStart', data, 'query start');\n  }\n\n  public notifyQueryComplete(data: QueryPerformanceData): void {\n    this.notifyObservers('onQueryComplete', data, 'query complete');\n  }\n}\n\n/**\n * Get the global performance tracker instance\n */\nexport function getScenePerformanceTracker(): ScenePerformanceTracker {\n  return ScenePerformanceTracker.getInstance();\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/{behaviors → performance}/SceneRenderProfiler.js

@@ -1,4 +1,6 @@
-import { writeSceneLog, writeSceneLogStyled } from '../utils/writeSceneLog.js';
+import { writePerformanceLog } from '../utils/writePerformanceLog.js';
+import { generateOperationId, getScenePerformanceTracker } from './ScenePerformanceTracker.js';
+import { PanelProfilingManager } from './PanelProfilingManager.js';
 import { LongFrameDetector } from './LongFrameDetector.js';
 
 var __typeError = (msg) => {
@@ -16,17 +18,20 @@ var __privateWrapper = (obj, member, setter, getter) => ({
     return __privateGet(obj, member, getter);
   }
 });
-var _profileInProgress, _interactionInProgress, _profileStartTs, _trailAnimationFrameId, _recordedTrailingSpans, _longFrameDetector, _longFramesCount, _longFramesTotalTime, _visibilityChangeHandler, _onInteractionComplete;
+var _profileInProgress, _interactionInProgress, _profileStartTs, _trailAnimationFrameId, _currentOperationId, _recordedTrailingSpans, _longFrameDetector, _longFramesCount, _longFramesTotalTime, _visibilityChangeHandler, _onInteractionComplete;
 const POST_STORM_WINDOW = 2e3;
 const DEFAULT_LONG_FRAME_THRESHOLD = 30;
 class SceneRenderProfiler {
-  constructor(queryController) {
-    this.queryController = queryController;
+  constructor(panelProfilingConfig) {
     __privateAdd(this, _profileInProgress, null);
     __privateAdd(this, _interactionInProgress, null);
     __privateAdd(this, _profileStartTs, null);
     __privateAdd(this, _trailAnimationFrameId, null);
-    // Will keep measured lengths trailing frames
+    // Generic metadata for observer notifications
+    this.metadata = {};
+    // Operation ID for correlating dashboard interaction events
+    __privateAdd(this, _currentOperationId);
+    // Trailing frame measurements
     __privateAdd(this, _recordedTrailingSpans, []);
     // Long frame tracking
     __privateAdd(this, _longFrameDetector);
@@ -35,7 +40,6 @@ class SceneRenderProfiler {
     __privateAdd(this, _visibilityChangeHandler, null);
     __privateAdd(this, _onInteractionComplete, null);
     this.measureTrailingFrames = (measurementStartTs, lastFrameTime, profileStartTs) => {
-      var _a, _b, _c, _d;
       const currentFrameTime = performance.now();
       const frameLength = currentFrameTime - lastFrameTime;
       __privateGet(this, _recordedTrailingSpans).push(frameLength);
@@ -48,108 +52,73 @@ class SceneRenderProfiler {
       } else {
         const slowFrames = processRecordedSpans(__privateGet(this, _recordedTrailingSpans));
         const slowFramesTime = slowFrames.reduce((acc, val) => acc + val, 0);
-        writeSceneLog(
-          "SceneRenderProfiler",
-          `Profile tail recorded - Slow frames: ${slowFramesTime.toFixed(1)}ms (${slowFrames.length} frames)`
+        writePerformanceLog(
+          "SRP",
+          "Profile tail recorded, slow frames duration:",
+          slowFramesTime,
+          slowFrames,
+          __privateGet(this, _profileInProgress)
         );
-        writeSceneLog("", `  \u251C\u2500 Origin: ${((_a = __privateGet(this, _profileInProgress)) == null ? void 0 : _a.origin) || "unknown"}`);
-        writeSceneLog("", `  \u2514\u2500 Crumbs:`, ((_b = __privateGet(this, _profileInProgress)) == null ? void 0 : _b.crumbs) || []);
         __privateSet(this, _recordedTrailingSpans, []);
         const profileDuration = measurementStartTs - profileStartTs;
-        if (typeof performance !== "undefined" && performance.mark) {
-          const profileName = ((_c = __privateGet(this, _profileInProgress)) == null ? void 0 : _c.origin) || "unknown";
-          const totalTime = profileDuration + slowFramesTime;
-          performance.mark(`Dashboard Profile End: ${profileName}`);
-          const startMarkName = `Dashboard Profile Start: ${profileName}`;
-          try {
-            performance.measure(
-              `Dashboard Profile: ${profileName} (${totalTime.toFixed(1)}ms)`,
-              startMarkName,
-              `Dashboard Profile End: ${profileName}`
-            );
-          } catch (e) {
-            performance.mark(`Dashboard Profile Complete: ${profileName} (${totalTime.toFixed(1)}ms)`);
-          }
-          if (slowFrames.length > 0) {
-            const slowFramesMarkName = `Slow Frames Summary: ${slowFrames.length} frames (${slowFramesTime.toFixed(
-              1
-            )}ms)`;
-            performance.mark(slowFramesMarkName);
-            slowFrames.forEach((frameTime, index) => {
-              if (frameTime > 16) {
-                try {
-                  const frameStartTime = __privateGet(this, _profileStartTs) + profileDuration + (index > 0 ? slowFrames.slice(0, index).reduce((sum, t) => sum + t, 0) : 0);
-                  const frameId = `slow-frame-${index}`;
-                  const frameStartMark = `${frameId}-start`;
-                  const frameEndMark = `${frameId}-end`;
-                  performance.mark(frameStartMark, { startTime: frameStartTime });
-                  performance.mark(frameEndMark, { startTime: frameStartTime + frameTime });
-                  performance.measure(`Slow Frame ${index + 1}: ${frameTime.toFixed(1)}ms`, frameStartMark, frameEndMark);
-                } catch (e) {
-                  performance.mark(`Slow Frame ${index + 1}: ${frameTime.toFixed(1)}ms`);
-                }
-              }
-            });
-          }
-        }
-        const completionTimestamp = performance.now();
-        writeSceneLog("SceneRenderProfiler", "Profile completed");
-        writeSceneLog("", `  \u251C\u2500 Timestamp: ${completionTimestamp.toFixed(1)}ms`);
-        writeSceneLog("", `  \u251C\u2500 Total time: ${(profileDuration + slowFramesTime).toFixed(1)}ms`);
-        writeSceneLog("", `  \u251C\u2500 Slow frames: ${slowFramesTime}ms (${slowFrames.length} frames)`);
-        writeSceneLog("", `  \u2514\u2500 Long frames: ${__privateGet(this, _longFramesTotalTime)}ms (${__privateGet(this, _longFramesCount)} frames)`);
-        __privateGet(this, _longFrameDetector).stop();
-        writeSceneLogStyled(
-          "SceneRenderProfiler",
-          `Stopped long frame detection - profile complete at ${completionTimestamp.toFixed(1)}ms`,
-          "color: #00CC00; font-weight: bold;"
+        const slowFrameSummary = slowFrames.length > 0 ? `${slowFramesTime.toFixed(1)}ms slow frames[tail recording] (${slowFrames.length}) \u26A0\uFE0F` : `${slowFramesTime.toFixed(1)}ms slow frames[tail recording] (${slowFrames.length})`;
+        const longFrameSummary = __privateGet(this, _longFramesCount) > 0 ? `${__privateGet(this, _longFramesTotalTime).toFixed(1)}ms long frames[LoAF] (${__privateGet(this, _longFramesCount)}) \u26A0\uFE0F` : `${__privateGet(this, _longFramesTotalTime).toFixed(1)}ms long frames[LoAF] (${__privateGet(this, _longFramesCount)})`;
+        writePerformanceLog(
+          "SRP",
+          `[PROFILER] Complete: ${(profileDuration + slowFramesTime).toFixed(
+            1
+          )}ms total | ${slowFrameSummary} | ${longFrameSummary}`
         );
+        __privateGet(this, _longFrameDetector).stop();
         __privateSet(this, _trailAnimationFrameId, null);
         const profileEndTs = profileStartTs + profileDuration + slowFramesTime;
         if (!__privateGet(this, _profileInProgress)) {
           return;
         }
-        performance.measure(`DashboardInteraction ${__privateGet(this, _profileInProgress).origin}`, {
-          start: profileStartTs,
-          end: profileEndTs
-        });
         const networkDuration = captureNetwork(profileStartTs, profileEndTs);
-        if (((_d = this.queryController) == null ? void 0 : _d.state.onProfileComplete) && __privateGet(this, _profileInProgress)) {
-          this.queryController.state.onProfileComplete({
-            origin: __privateGet(this, _profileInProgress).origin,
-            crumbs: __privateGet(this, _profileInProgress).crumbs,
+        if (__privateGet(this, _profileInProgress)) {
+          const dashboardData = {
+            operationId: __privateGet(this, _currentOperationId) || generateOperationId("dashboard-fallback"),
+            interactionType: __privateGet(this, _profileInProgress).origin,
+            timestamp: profileEndTs,
             duration: profileDuration + slowFramesTime,
             networkDuration,
-            startTs: profileStartTs,
-            endTs: profileEndTs,
             longFramesCount: __privateGet(this, _longFramesCount),
             longFramesTotalTime: __privateGet(this, _longFramesTotalTime),
-            // @ts-ignore
-            jsHeapSizeLimit: performance.memory ? performance.memory.jsHeapSizeLimit : 0,
-            // @ts-ignore
-            usedJSHeapSize: performance.memory ? performance.memory.usedJSHeapSize : 0,
-            // @ts-ignore
-            totalJSHeapSize: performance.memory ? performance.memory.totalJSHeapSize : 0
-          });
+            metadata: this.metadata
+          };
+          const tracker = getScenePerformanceTracker();
+          tracker.notifyDashboardInteractionComplete(dashboardData);
           __privateSet(this, _profileInProgress, null);
           __privateSet(this, _trailAnimationFrameId, null);
         }
-        if (window.__runs) {
-          window.__runs += `${Date.now()}, ${profileDuration + slowFramesTime}
-`;
-        } else {
-          window.__runs = `${Date.now()}, ${profileDuration + slowFramesTime}
-`;
-        }
       }
     };
     __privateSet(this, _longFrameDetector, new LongFrameDetector());
     this.setupVisibilityChangeHandler();
     __privateSet(this, _interactionInProgress, null);
+    if (panelProfilingConfig) {
+      this._panelProfilingManager = new PanelProfilingManager(panelProfilingConfig);
+    }
+  }
+  /** Set generic metadata for observer notifications */
+  setMetadata(metadata) {
+    this.metadata = { ...metadata };
   }
   setQueryController(queryController) {
     this.queryController = queryController;
   }
+  /** Attach panel profiling to a scene object */
+  attachPanelProfiling(sceneObject) {
+    var _a;
+    (_a = this._panelProfilingManager) == null ? void 0 : _a.attachToScene(sceneObject);
+  }
+  /** Attach profiler to a specific panel */
+  attachProfilerToPanel(panel) {
+    var _a;
+    writePerformanceLog("SRP", "Attaching profiler to panel", panel.state.key);
+    (_a = this._panelProfilingManager) == null ? void 0 : _a.attachProfilerToPanel(panel);
+  }
   setInteractionCompleteHandler(handler) {
     __privateSet(this, _onInteractionComplete, handler != null ? handler : null);
   }
@@ -159,7 +128,7 @@ class SceneRenderProfiler {
     }
     __privateSet(this, _visibilityChangeHandler, () => {
       if (document.hidden && __privateGet(this, _profileInProgress)) {
-        writeSceneLog("SceneRenderProfiler", "Tab became inactive, cancelling profile");
+        writePerformanceLog("SRP", "Tab became inactive, cancelling profile");
         this.cancelProfile();
       }
     });
@@ -168,16 +137,18 @@ class SceneRenderProfiler {
     }
   }
   cleanup() {
+    var _a;
     if (__privateGet(this, _visibilityChangeHandler) && typeof document !== "undefined") {
       document.removeEventListener("visibilitychange", __privateGet(this, _visibilityChangeHandler));
       __privateSet(this, _visibilityChangeHandler, null);
     }
     __privateGet(this, _longFrameDetector).stop();
     this.cancelProfile();
+    (_a = this._panelProfilingManager) == null ? void 0 : _a.cleanup();
   }
   startProfile(name) {
     if (document.hidden) {
-      writeSceneLog("SceneRenderProfiler", "Tab is inactive, skipping profile", name);
+      writePerformanceLog("SRP", "Tab is inactive, skipping profile", name);
       return;
     }
     if (__privateGet(this, _profileInProgress)) {
@@ -193,14 +164,14 @@ class SceneRenderProfiler {
   }
   startInteraction(interaction) {
     if (__privateGet(this, _interactionInProgress)) {
-      writeSceneLog("profile", "Cancelled interaction:", __privateGet(this, _interactionInProgress));
+      writePerformanceLog("SRP", "Cancelled interaction:", __privateGet(this, _interactionInProgress));
       __privateSet(this, _interactionInProgress, null);
     }
     __privateSet(this, _interactionInProgress, {
       interaction,
       startTs: performance.now()
     });
-    writeSceneLog("SceneRenderProfiler", "Started interaction:", interaction);
+    writePerformanceLog("SRP", "Started interaction:", interaction);
   }
   stopInteraction() {
     if (!__privateGet(this, _interactionInProgress)) {
@@ -209,11 +180,10 @@ class SceneRenderProfiler {
     const endTs = performance.now();
     const interactionDuration = endTs - __privateGet(this, _interactionInProgress).startTs;
     const networkDuration = captureNetwork(__privateGet(this, _interactionInProgress).startTs, endTs);
-    writeSceneLog("SceneRenderProfiler", "Completed interaction:");
-    writeSceneLog("", `  \u251C\u2500 Total time: ${interactionDuration.toFixed(1)}ms`);
-    writeSceneLog("", `  \u251C\u2500 Network duration: ${networkDuration.toFixed(1)}ms`);
-    writeSceneLog("", `  \u251C\u2500 StartTs: ${__privateGet(this, _interactionInProgress).startTs.toFixed(1)}ms`);
-    writeSceneLog("", `  \u2514\u2500 EndTs: ${endTs.toFixed(1)}ms`);
+    writePerformanceLog(
+      "SRP",
+      `[INTERACTION] Complete: ${interactionDuration.toFixed(1)}ms total | ${networkDuration.toFixed(1)}ms network`
+    );
     if (__privateGet(this, _onInteractionComplete) && __privateGet(this, _profileInProgress)) {
       __privateGet(this, _onInteractionComplete).call(this, {
         origin: __privateGet(this, _interactionInProgress).interaction,
@@ -241,32 +211,24 @@ class SceneRenderProfiler {
     return (_b = (_a = __privateGet(this, _interactionInProgress)) == null ? void 0 : _a.interaction) != null ? _b : null;
   }
   /**
-   * Starts a new profile for performance measurement.
-   *
-   * @param name - The origin/trigger of the profile (e.g., 'time_range_change', 'variable_value_changed')
-   * @param force - Whether this is a "forced" profile (true) or "clean" profile (false)
-   *               - "forced": Started by canceling an existing profile that was recording trailing frames
-   *                           This happens when a new user interaction occurs before the previous one
-   *                           finished measuring its performance impact
-   *               - "clean": Started when no profile is currently active
+   * Start new performance profile
+   * @param name - Profile trigger (e.g., 'time_range_change')
+   * @param force - True if canceling existing profile, false if starting clean
    */
   _startNewProfile(name, force = false) {
-    var _a;
+    const profileType = force ? "forced" : "clean";
+    writePerformanceLog("SRP", `[PROFILER] ${name} started (${profileType})`);
     __privateSet(this, _profileInProgress, { origin: name, crumbs: [] });
     __privateSet(this, _profileStartTs, performance.now());
     __privateSet(this, _longFramesCount, 0);
     __privateSet(this, _longFramesTotalTime, 0);
-    if (typeof performance !== "undefined" && performance.mark) {
-      const markName = `Dashboard Profile Start: ${name}`;
-      performance.mark(markName);
-    }
-    writeSceneLogStyled(
-      "SceneRenderProfiler",
-      `Profile started[${force ? "forced" : "clean"}]`,
-      "color: #FFCC00; font-weight: bold;"
-    );
-    writeSceneLog("", `  \u251C\u2500 Origin: ${((_a = __privateGet(this, _profileInProgress)) == null ? void 0 : _a.origin) || "unknown"}`);
-    writeSceneLog("", `  \u2514\u2500 Timestamp: ${__privateGet(this, _profileStartTs).toFixed(1)}ms`);
+    __privateSet(this, _currentOperationId, generateOperationId("dashboard"));
+    getScenePerformanceTracker().notifyDashboardInteractionStart({
+      operationId: __privateGet(this, _currentOperationId),
+      interactionType: name,
+      timestamp: __privateGet(this, _profileStartTs),
+      metadata: this.metadata
+    });
     __privateGet(this, _longFrameDetector).start((event) => {
       if (!__privateGet(this, _profileInProgress) || !__privateGet(this, _profileStartTs)) {
         return;
@@ -285,12 +247,9 @@ class SceneRenderProfiler {
   }
   tryCompletingProfile() {
     var _a;
-    if (!__privateGet(this, _profileInProgress)) {
-      return;
-    }
-    writeSceneLog("SceneRenderProfiler", "Trying to complete profile", __privateGet(this, _profileInProgress));
+    writePerformanceLog("SRP", "Trying to complete profile", __privateGet(this, _profileInProgress));
     if (((_a = this.queryController) == null ? void 0 : _a.runningQueriesCount()) === 0 && __privateGet(this, _profileInProgress)) {
-      writeSceneLog("SceneRenderProfiler", "All queries completed, starting tail measurement");
+      writePerformanceLog("SRP", "All queries completed, stopping profile");
       this.recordProfileTail(performance.now(), __privateGet(this, _profileStartTs));
     }
   }
@@ -301,20 +260,19 @@ class SceneRenderProfiler {
     if (__privateGet(this, _trailAnimationFrameId)) {
       cancelAnimationFrame(__privateGet(this, _trailAnimationFrameId));
       __privateSet(this, _trailAnimationFrameId, null);
-      writeSceneLog("SceneRenderProfiler", "Cancelled recording frames, new profile started");
+      writePerformanceLog("SRP", "Cancelled recording frames, new profile started");
     }
   }
-  // cancel profile
   cancelProfile() {
     if (__privateGet(this, _profileInProgress)) {
-      writeSceneLog("SceneRenderProfiler", "Cancelling profile", __privateGet(this, _profileInProgress));
+      writePerformanceLog("SRP", "Cancelling profile", __privateGet(this, _profileInProgress));
       __privateSet(this, _profileInProgress, null);
       if (__privateGet(this, _trailAnimationFrameId)) {
         cancelAnimationFrame(__privateGet(this, _trailAnimationFrameId));
         __privateSet(this, _trailAnimationFrameId, null);
       }
       __privateGet(this, _longFrameDetector).stop();
-      writeSceneLog("SceneRenderProfiler", "Stopped long frame detection - profile cancelled");
+      writePerformanceLog("SRP", "Stopped long frame detection - profile cancelled");
       __privateSet(this, _recordedTrailingSpans, []);
       __privateSet(this, _longFramesCount, 0);
       __privateSet(this, _longFramesTotalTime, 0);
@@ -322,7 +280,13 @@ class SceneRenderProfiler {
   }
   addCrumb(crumb) {
     if (__privateGet(this, _profileInProgress)) {
-      writeSceneLog("SceneRenderProfiler", "Adding crumb:", crumb);
+      getScenePerformanceTracker().notifyDashboardInteractionMilestone({
+        operationId: generateOperationId("dashboard-milestone"),
+        interactionType: __privateGet(this, _profileInProgress).origin,
+        timestamp: performance.now(),
+        milestone: crumb,
+        metadata: this.metadata
+      });
       __privateGet(this, _profileInProgress).crumbs.push(crumb);
     }
   }
@@ -331,6 +295,7 @@ _profileInProgress = new WeakMap();
 _interactionInProgress = new WeakMap();
 _profileStartTs = new WeakMap();
 _trailAnimationFrameId = new WeakMap();
+_currentOperationId = new WeakMap();
 _recordedTrailingSpans = new WeakMap();
 _longFrameDetector = new WeakMap();
 _longFramesCount = new WeakMap();
@@ -379,16 +344,6 @@ function calculateNetworkTime(requests) {
   totalNetworkTime += currentEnd - currentStart;
   return totalNetworkTime;
 }
-const REFRESH_INTERACTION = "refresh";
-const TIME_RANGE_CHANGE_INTERACTION = "time_range_change";
-const FILTER_REMOVED_INTERACTION = "filter_removed";
-const FILTER_CHANGED_INTERACTION = "filter_changed";
-const FILTER_RESTORED_INTERACTION = "filter_restored";
-const VARIABLE_VALUE_CHANGED_INTERACTION = "variable_value_changed";
-const SCOPES_CHANGED_INTERACTION = "scopes_changed";
-const ADHOC_KEYS_DROPDOWN_INTERACTION = "adhoc_keys_dropdown";
-const ADHOC_VALUES_DROPDOWN_INTERACTION = "adhoc_values_dropdown";
-const GROUPBY_DIMENSIONS_INTERACTION = "groupby_dimensions";
 
-export { ADHOC_KEYS_DROPDOWN_INTERACTION, ADHOC_VALUES_DROPDOWN_INTERACTION, FILTER_CHANGED_INTERACTION, FILTER_REMOVED_INTERACTION, FILTER_RESTORED_INTERACTION, GROUPBY_DIMENSIONS_INTERACTION, REFRESH_INTERACTION, SCOPES_CHANGED_INTERACTION, SceneRenderProfiler, TIME_RANGE_CHANGE_INTERACTION, VARIABLE_VALUE_CHANGED_INTERACTION, calculateNetworkTime, captureNetwork, processRecordedSpans };
+export { SceneRenderProfiler, calculateNetworkTime, captureNetwork, processRecordedSpans };
 //# sourceMappingURL=SceneRenderProfiler.js.map