@paulirish/trace_engine 0.0.10 → 0.0.11

package/models/trace/handlers/LayerTreeHandler.js

@@ -1,90 +1,116 @@
-import * as Helpers from "../helpers/helpers.js";
-import * as Types from "../types/types.js";
-import { data as metaHandlerData } from "./MetaHandler.js";
-import { HandlerState } from "./types.js";
-let handlerState = HandlerState.UNINITIALIZED;
+// Copyright 2023 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+import * as Helpers from '../helpers/helpers.js';
+import * as Types from '../types/types.js';
+import { data as metaHandlerData } from './MetaHandler.js';
+let handlerState = 1 /* HandlerState.UNINITIALIZED */;
 const paintEvents = [];
 const snapshotEvents = [];
-const paintToSnapshotMap = /* @__PURE__ */ new Map();
+const paintToSnapshotMap = new Map();
 let lastPaintForLayerId = {};
 let currentMainFrameLayerTreeId = null;
 const updateLayerEvents = [];
 const relevantEvents = [];
 export function reset() {
-  handlerState = HandlerState.UNINITIALIZED;
-  paintEvents.length = 0;
-  snapshotEvents.length = 0;
-  paintToSnapshotMap.clear();
-  lastPaintForLayerId = {};
-  currentMainFrameLayerTreeId = null;
-  updateLayerEvents.length = 0;
-  relevantEvents.length = 0;
+    handlerState = 1 /* HandlerState.UNINITIALIZED */;
+    paintEvents.length = 0;
+    snapshotEvents.length = 0;
+    paintToSnapshotMap.clear();
+    lastPaintForLayerId = {};
+    currentMainFrameLayerTreeId = null;
+    updateLayerEvents.length = 0;
+    relevantEvents.length = 0;
 }
 export function initialize() {
-  if (handlerState !== HandlerState.UNINITIALIZED) {
-    throw new Error("LayerTree Handler was not reset before being initialized");
-  }
-  handlerState = HandlerState.INITIALIZED;
+    if (handlerState !== 1 /* HandlerState.UNINITIALIZED */) {
+        throw new Error('LayerTree Handler was not reset before being initialized');
+    }
+    handlerState = 2 /* HandlerState.INITIALIZED */;
 }
 export function handleEvent(event) {
-  if (Types.TraceEvents.isTraceEventPaint(event) || Types.TraceEvents.isTraceEventDisplayListItemListSnapshot(event) || Types.TraceEvents.isTraceEventUpdateLayer(event) || Types.TraceEvents.isTraceEventSetLayerId(event)) {
-    relevantEvents.push(event);
-  }
+    // We gather up the events here but do all the processing in finalize(). This
+    // is because we need to have all the events before we process them, and we
+    // need the Meta handler to be finalized() so we can use its data as we need
+    // the mainFrameId to know which Layer(s) to care about.
+    if (Types.TraceEvents.isTraceEventPaint(event) || Types.TraceEvents.isTraceEventDisplayListItemListSnapshot(event) ||
+        Types.TraceEvents.isTraceEventUpdateLayer(event) || Types.TraceEvents.isTraceEventSetLayerId(event)) {
+        relevantEvents.push(event);
+    }
 }
 export async function finalize() {
-  if (handlerState !== HandlerState.INITIALIZED) {
-    throw new Error("LayerTree Handler is not initialized");
-  }
-  const metaData = metaHandlerData();
-  Helpers.Trace.sortTraceEventsInPlace(relevantEvents);
-  for (const event of relevantEvents) {
-    if (Types.TraceEvents.isTraceEventSetLayerId(event)) {
-      if (metaData.mainFrameId !== event.args.data.frame) {
-        continue;
-      }
-      currentMainFrameLayerTreeId = event.args.data.layerTreeId;
-    } else if (Types.TraceEvents.isTraceEventUpdateLayer(event)) {
-      updateLayerEvents.push(event);
-    } else if (Types.TraceEvents.isTraceEventPaint(event)) {
-      if (!event.args.data.layerId) {
-        continue;
-      }
-      paintEvents.push(event);
-      lastPaintForLayerId[event.args.data.layerId] = event;
-      continue;
-    } else if (Types.TraceEvents.isTraceEventDisplayListItemListSnapshot(event)) {
-      let lastUpdateLayerEventForThread = null;
-      for (let i = updateLayerEvents.length - 1; i > -1; i--) {
-        const updateEvent = updateLayerEvents[i];
-        if (updateEvent.pid === event.pid && updateEvent.tid === event.tid) {
-          lastUpdateLayerEventForThread = updateEvent;
-          break;
+    if (handlerState !== 2 /* HandlerState.INITIALIZED */) {
+        throw new Error('LayerTree Handler is not initialized');
+    }
+    const metaData = metaHandlerData();
+    Helpers.Trace.sortTraceEventsInPlace(relevantEvents);
+    for (const event of relevantEvents) {
+        if (Types.TraceEvents.isTraceEventSetLayerId(event)) {
+            if (metaData.mainFrameId !== event.args.data.frame) {
+                // We only care about LayerId changes that affect the main frame.
+                continue;
+            }
+            currentMainFrameLayerTreeId = event.args.data.layerTreeId;
+        }
+        else if (Types.TraceEvents.isTraceEventUpdateLayer(event)) {
+            // We don't do anything with this event, but we need to store it because
+            // the information in it determines if we need to care about future
+            // snapshot events - we need to know what the active layer is when we see a
+            // snapshot.
+            updateLayerEvents.push(event);
+        }
+        else if (Types.TraceEvents.isTraceEventPaint(event)) {
+            if (!event.args.data.layerId) {
+                // Note that this check purposefully includes excluding an event with a layerId of 0.
+                // 0 indicates that this paint was for a subframe - we do not want these
+                // as we only care about paints for top level frames.
+                continue;
+            }
+            paintEvents.push(event);
+            lastPaintForLayerId[event.args.data.layerId] = event;
+            continue;
+        }
+        else if (Types.TraceEvents.isTraceEventDisplayListItemListSnapshot(event)) {
+            // First we figure out which layer is active for this event's thread. To
+            // do this we work backwards through the list of UpdateLayerEvents,
+            // finding the first one (i.e. the most recent one) with the same pid and
+            // tid.
+            let lastUpdateLayerEventForThread = null;
+            for (let i = updateLayerEvents.length - 1; i > -1; i--) {
+                const updateEvent = updateLayerEvents[i];
+                if (updateEvent.pid === event.pid && updateEvent.tid === event.tid) {
+                    lastUpdateLayerEventForThread = updateEvent;
+                    break;
+                }
+            }
+            if (!lastUpdateLayerEventForThread) {
+                // No active layer, so this snapshot is not relevant.
+                continue;
+            }
+            if (lastUpdateLayerEventForThread.args.layerTreeId !== currentMainFrameLayerTreeId) {
+                // Snapshot applies to a layer that is not the main frame, so discard.
+                continue;
+            }
+            const paintEvent = lastPaintForLayerId[lastUpdateLayerEventForThread.args.layerId];
+            if (!paintEvent) {
+                // No paint event for this layer, so discard.
+                continue;
+            }
+            snapshotEvents.push(event);
+            // Store the relationship between the paint and the snapshot.
+            paintToSnapshotMap.set(paintEvent, event);
         }
-      }
-      if (!lastUpdateLayerEventForThread) {
-        continue;
-      }
-      if (lastUpdateLayerEventForThread.args.layerTreeId !== currentMainFrameLayerTreeId) {
-        continue;
-      }
-      const paintEvent = lastPaintForLayerId[lastUpdateLayerEventForThread.args.layerId];
-      if (!paintEvent) {
-        continue;
-      }
-      snapshotEvents.push(event);
-      paintToSnapshotMap.set(paintEvent, event);
     }
-  }
-  handlerState = HandlerState.FINALIZED;
+    handlerState = 3 /* HandlerState.FINALIZED */;
 }
 export function data() {
-  return {
-    paints: Array.from(paintEvents),
-    snapshots: Array.from(snapshotEvents),
-    paintsToSnapshots: new Map(paintToSnapshotMap)
-  };
+    return {
+        paints: Array.from(paintEvents),
+        snapshots: Array.from(snapshotEvents),
+        paintsToSnapshots: new Map(paintToSnapshotMap),
+    };
 }
 export function deps() {
-  return ["Meta"];
+    return ['Meta'];
 }
-//# sourceMappingURL=LayerTreeHandler.js.map
+//# sourceMappingURL=LayerTreeHandler.js.map

package/models/trace/handlers/LayerTreeHandler.js.map

@@ -1,7 +1 @@
-{
-  "version": 3,
-  "sources": ["../../../../../../../front_end/models/trace/handlers/LayerTreeHandler.ts"],
-  "sourcesContent": ["// Copyright 2023 The Chromium Authors. All rights reserved.\n// Use of this source code is governed by a BSD-style license that can be\n// found in the LICENSE file.\n\nimport * as Helpers from '../helpers/helpers.js';\nimport * as Types from '../types/types.js';\n\nimport {data as metaHandlerData} from './MetaHandler.js';\nimport {HandlerState, type TraceEventHandlerName} from './types.js';\n\nlet handlerState = HandlerState.UNINITIALIZED;\n\nconst paintEvents: Types.TraceEvents.TraceEventPaint[] = [];\nconst snapshotEvents: Types.TraceEvents.TraceEventDisplayItemListSnapshot[] = [];\nconst paintToSnapshotMap =\n    new Map<Types.TraceEvents.TraceEventPaint, Types.TraceEvents.TraceEventDisplayItemListSnapshot>();\n\nlet lastPaintForLayerId: Record<number, Types.TraceEvents.TraceEventPaint> = {};\n\nlet currentMainFrameLayerTreeId: number|null = null;\nconst updateLayerEvents: Types.TraceEvents.TraceEventUpdateLayer[] = [];\n\ntype RelevantLayerTreeEvent = Types.TraceEvents.TraceEventPaint|\n                              Types.TraceEvents.TraceEventDisplayItemListSnapshot|\n                              Types.TraceEvents.TraceEventUpdateLayer|Types.TraceEvents.TraceEventSetLayerTreeId;\n\nconst relevantEvents: RelevantLayerTreeEvent[] = [];\nexport function reset(): void {\n  handlerState = HandlerState.UNINITIALIZED;\n  paintEvents.length = 0;\n  snapshotEvents.length = 0;\n  paintToSnapshotMap.clear();\n\n  lastPaintForLayerId = {};\n  currentMainFrameLayerTreeId = null;\n  updateLayerEvents.length = 0;\n  relevantEvents.length = 0;\n}\n\nexport function initialize(): void {\n  if (handlerState !== HandlerState.UNINITIALIZED) {\n    throw new Error('LayerTree Handler was not reset before being initialized');\n  }\n\n  handlerState = HandlerState.INITIALIZED;\n}\n\nexport function handleEvent(event: Types.TraceEvents.TraceEventData): void {\n  // We gather up the events here but do all the processing in finalize(). This\n  // is because we need to have all the events before we process them, and we\n  // need the Meta handler to be finalized() so we can use its data as we need\n  // the mainFrameId to know which Layer(s) to care about.\n  if (Types.TraceEvents.isTraceEventPaint(event) || Types.TraceEvents.isTraceEventDisplayListItemListSnapshot(event) ||\n      Types.TraceEvents.isTraceEventUpdateLayer(event) || Types.TraceEvents.isTraceEventSetLayerId(event)) {\n    relevantEvents.push(event);\n  }\n}\n\nexport async function finalize(): Promise<void> {\n  if (handlerState !== HandlerState.INITIALIZED) {\n    throw new Error('LayerTree Handler is not initialized');\n  }\n\n  const metaData = metaHandlerData();\n  Helpers.Trace.sortTraceEventsInPlace(relevantEvents);\n\n  for (const event of relevantEvents) {\n    if (Types.TraceEvents.isTraceEventSetLayerId(event)) {\n      if (metaData.mainFrameId !== event.args.data.frame) {\n        // We only care about LayerId changes that affect the main frame.\n        continue;\n      }\n      currentMainFrameLayerTreeId = event.args.data.layerTreeId;\n    } else if (Types.TraceEvents.isTraceEventUpdateLayer(event)) {\n      // We don't do anything with this event, but we need to store it because\n      // the information in it determines if we need to care about future\n      // snapshot events - we need to know what the active layer is when we see a\n      // snapshot.\n      updateLayerEvents.push(event);\n    } else if (Types.TraceEvents.isTraceEventPaint(event)) {\n      if (!event.args.data.layerId) {\n        // Note that this check purposefully includes excluding an event with a layerId of 0.\n        // 0 indicates that this paint was for a subframe - we do not want these\n        // as we only care about paints for top level frames.\n        continue;\n      }\n      paintEvents.push(event);\n      lastPaintForLayerId[event.args.data.layerId] = event;\n      continue;\n    } else if (Types.TraceEvents.isTraceEventDisplayListItemListSnapshot(event)) {\n      // First we figure out which layer is active for this event's thread. To\n      // do this we work backwards through the list of UpdateLayerEvents,\n      // finding the first one (i.e. the most recent one) with the same pid and\n      // tid.\n      let lastUpdateLayerEventForThread: Types.TraceEvents.TraceEventUpdateLayer|null = null;\n      for (let i = updateLayerEvents.length - 1; i > -1; i--) {\n        const updateEvent = updateLayerEvents[i];\n        if (updateEvent.pid === event.pid && updateEvent.tid === event.tid) {\n          lastUpdateLayerEventForThread = updateEvent;\n          break;\n        }\n      }\n      if (!lastUpdateLayerEventForThread) {\n        // No active layer, so this snapshot is not relevant.\n        continue;\n      }\n      if (lastUpdateLayerEventForThread.args.layerTreeId !== currentMainFrameLayerTreeId) {\n        // Snapshot applies to a layer that is not the main frame, so discard.\n        continue;\n      }\n      const paintEvent = lastPaintForLayerId[lastUpdateLayerEventForThread.args.layerId];\n      if (!paintEvent) {\n        // No paint event for this layer, so discard.\n        continue;\n      }\n      snapshotEvents.push(event);\n\n      // Store the relationship between the paint and the snapshot.\n      paintToSnapshotMap.set(paintEvent, event);\n    }\n  }\n\n  handlerState = HandlerState.FINALIZED;\n}\n\nexport interface LayerTreeData {\n  paints: Types.TraceEvents.TraceEventPaint[];\n  snapshots: Types.TraceEvents.TraceEventDisplayItemListSnapshot[];\n  paintsToSnapshots: Map<Types.TraceEvents.TraceEventPaint, Types.TraceEvents.TraceEventDisplayItemListSnapshot>;\n}\n\nexport function data(): LayerTreeData {\n  return {\n    paints: Array.from(paintEvents),\n    snapshots: Array.from(snapshotEvents),\n    paintsToSnapshots: new Map(paintToSnapshotMap),\n  };\n}\n\nexport function deps(): TraceEventHandlerName[] {\n  return ['Meta'];\n}\n"],
-  "mappings": "AAIA;AACA;AAEA;AACA;AAEA,IAAI,eAAe,aAAa;AAEhC,MAAM,cAAmD;AACzD,MAAM,iBAAwE;AAC9E,MAAM,qBACF,oBAAI;AAER,IAAI,sBAAyE;AAE7E,IAAI,8BAA2C;AAC/C,MAAM,oBAA+D;AAMrE,MAAM,iBAA2C;AAC1C,wBAAuB;AAC5B,iBAAe,aAAa;AAC5B,cAAY,SAAS;AACrB,iBAAe,SAAS;AACxB,qBAAmB;AAEnB,wBAAsB;AACtB,gCAA8B;AAC9B,oBAAkB,SAAS;AAC3B,iBAAe,SAAS;AAAA;AAGnB,6BAA4B;AACjC,MAAI,iBAAiB,aAAa,eAAe;AAC/C,UAAM,IAAI,MAAM;AAAA;AAGlB,iBAAe,aAAa;AAAA;AAGvB,4BAAqB,OAA+C;AAKzE,MAAI,MAAM,YAAY,kBAAkB,UAAU,MAAM,YAAY,wCAAwC,UACxG,MAAM,YAAY,wBAAwB,UAAU,MAAM,YAAY,uBAAuB,QAAQ;AACvG,mBAAe,KAAK;AAAA;AAAA;AAIxB,iCAAgD;AAC9C,MAAI,iBAAiB,aAAa,aAAa;AAC7C,UAAM,IAAI,MAAM;AAAA;AAGlB,QAAM,WAAW;AACjB,UAAQ,MAAM,uBAAuB;AAErC,aAAW,SAAS,gBAAgB;AAClC,QAAI,MAAM,YAAY,uBAAuB,QAAQ;AACnD,UAAI,SAAS,gBAAgB,MAAM,KAAK,KAAK,OAAO;AAElD;AAAA;AAEF,oCAA8B,MAAM,KAAK,KAAK;AAAA,eACrC,MAAM,YAAY,wBAAwB,QAAQ;AAK3D,wBAAkB,KAAK;AAAA,eACd,MAAM,YAAY,kBAAkB,QAAQ;AACrD,UAAI,CAAC,MAAM,KAAK,KAAK,SAAS;AAI5B;AAAA;AAEF,kBAAY,KAAK;AACjB,0BAAoB,MAAM,KAAK,KAAK,WAAW;AAC/C;AAAA,eACS,MAAM,YAAY,wCAAwC,QAAQ;AAK3E,UAAI,gCAA8E;AAClF,eAAS,IAAI,kBAAkB,SAAS,GAAG,IAAI,IAAI,KAAK;AACtD,cAAM,cAAc,kBAAkB;AACtC,YAAI,YAAY,QAAQ,MAAM,OAAO,YAAY,QAAQ,MAAM,KAAK;AAClE,0CAAgC;AAChC;AAAA;AAAA;AAGJ,UAAI,CAAC,+BAA+B;AAElC;AAAA;AAEF,UAAI,8BAA8B,KAAK,gBAAgB,6BAA6B;AAElF;AAAA;AAEF,YAAM,aAAa,oBAAoB,8BAA8B,KAAK;AAC1E,UAAI,CAAC,YAAY;AAEf;AAAA;AAEF,qBAAe,KAAK;AAGpB,yBAAmB,IAAI,YAAY;AAAA;AAAA;AAIvC,iBAAe,aAAa;AAAA;AASvB,uBAA+B;AACpC,SAAO;AAAA,IACL,QAAQ,MAAM,KAAK;AAAA,IACnB,WAAW,MAAM,KAAK;AAAA,IACtB,mBAAmB,IAAI,IAAI;AAAA;AAAA;AAIxB,uBAAyC;AAC9C,SAAO,CAAC;AAAA;",
-  "names": []
-}
+{"version":3,"file":"LayerTreeHandler.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/handlers/LayerTreeHandler.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright 2023 The Chromium Authors. All rights reserved.\n// Use of this source code is governed by a BSD-style license that can be\n// found in the LICENSE file.\n\nimport * as Helpers from '../helpers/helpers.js';\nimport * as Types from '../types/types.js';\n\nimport {data as metaHandlerData} from './MetaHandler.js';\nimport {HandlerState, type TraceEventHandlerName} from './types.js';\n\nlet handlerState = HandlerState.UNINITIALIZED;\n\nconst paintEvents: Types.TraceEvents.TraceEventPaint[] = [];\nconst snapshotEvents: Types.TraceEvents.TraceEventDisplayItemListSnapshot[] = [];\nconst paintToSnapshotMap =\n    new Map<Types.TraceEvents.TraceEventPaint, Types.TraceEvents.TraceEventDisplayItemListSnapshot>();\n\nlet lastPaintForLayerId: Record<number, Types.TraceEvents.TraceEventPaint> = {};\n\nlet currentMainFrameLayerTreeId: number|null = null;\nconst updateLayerEvents: Types.TraceEvents.TraceEventUpdateLayer[] = [];\n\ntype RelevantLayerTreeEvent = Types.TraceEvents.TraceEventPaint|\n                              Types.TraceEvents.TraceEventDisplayItemListSnapshot|\n                              Types.TraceEvents.TraceEventUpdateLayer|Types.TraceEvents.TraceEventSetLayerTreeId;\n\nconst relevantEvents: RelevantLayerTreeEvent[] = [];\nexport function reset(): void {\n  handlerState = HandlerState.UNINITIALIZED;\n  paintEvents.length = 0;\n  snapshotEvents.length = 0;\n  paintToSnapshotMap.clear();\n\n  lastPaintForLayerId = {};\n  currentMainFrameLayerTreeId = null;\n  updateLayerEvents.length = 0;\n  relevantEvents.length = 0;\n}\n\nexport function initialize(): void {\n  if (handlerState !== HandlerState.UNINITIALIZED) {\n    throw new Error('LayerTree Handler was not reset before being initialized');\n  }\n\n  handlerState = HandlerState.INITIALIZED;\n}\n\nexport function handleEvent(event: Types.TraceEvents.TraceEventData): void {\n  // We gather up the events here but do all the processing in finalize(). This\n  // is because we need to have all the events before we process them, and we\n  // need the Meta handler to be finalized() so we can use its data as we need\n  // the mainFrameId to know which Layer(s) to care about.\n  if (Types.TraceEvents.isTraceEventPaint(event) || Types.TraceEvents.isTraceEventDisplayListItemListSnapshot(event) ||\n      Types.TraceEvents.isTraceEventUpdateLayer(event) || Types.TraceEvents.isTraceEventSetLayerId(event)) {\n    relevantEvents.push(event);\n  }\n}\n\nexport async function finalize(): Promise<void> {\n  if (handlerState !== HandlerState.INITIALIZED) {\n    throw new Error('LayerTree Handler is not initialized');\n  }\n\n  const metaData = metaHandlerData();\n  Helpers.Trace.sortTraceEventsInPlace(relevantEvents);\n\n  for (const event of relevantEvents) {\n    if (Types.TraceEvents.isTraceEventSetLayerId(event)) {\n      if (metaData.mainFrameId !== event.args.data.frame) {\n        // We only care about LayerId changes that affect the main frame.\n        continue;\n      }\n      currentMainFrameLayerTreeId = event.args.data.layerTreeId;\n    } else if (Types.TraceEvents.isTraceEventUpdateLayer(event)) {\n      // We don't do anything with this event, but we need to store it because\n      // the information in it determines if we need to care about future\n      // snapshot events - we need to know what the active layer is when we see a\n      // snapshot.\n      updateLayerEvents.push(event);\n    } else if (Types.TraceEvents.isTraceEventPaint(event)) {\n      if (!event.args.data.layerId) {\n        // Note that this check purposefully includes excluding an event with a layerId of 0.\n        // 0 indicates that this paint was for a subframe - we do not want these\n        // as we only care about paints for top level frames.\n        continue;\n      }\n      paintEvents.push(event);\n      lastPaintForLayerId[event.args.data.layerId] = event;\n      continue;\n    } else if (Types.TraceEvents.isTraceEventDisplayListItemListSnapshot(event)) {\n      // First we figure out which layer is active for this event's thread. To\n      // do this we work backwards through the list of UpdateLayerEvents,\n      // finding the first one (i.e. the most recent one) with the same pid and\n      // tid.\n      let lastUpdateLayerEventForThread: Types.TraceEvents.TraceEventUpdateLayer|null = null;\n      for (let i = updateLayerEvents.length - 1; i > -1; i--) {\n        const updateEvent = updateLayerEvents[i];\n        if (updateEvent.pid === event.pid && updateEvent.tid === event.tid) {\n          lastUpdateLayerEventForThread = updateEvent;\n          break;\n        }\n      }\n      if (!lastUpdateLayerEventForThread) {\n        // No active layer, so this snapshot is not relevant.\n        continue;\n      }\n      if (lastUpdateLayerEventForThread.args.layerTreeId !== currentMainFrameLayerTreeId) {\n        // Snapshot applies to a layer that is not the main frame, so discard.\n        continue;\n      }\n      const paintEvent = lastPaintForLayerId[lastUpdateLayerEventForThread.args.layerId];\n      if (!paintEvent) {\n        // No paint event for this layer, so discard.\n        continue;\n      }\n      snapshotEvents.push(event);\n\n      // Store the relationship between the paint and the snapshot.\n      paintToSnapshotMap.set(paintEvent, event);\n    }\n  }\n\n  handlerState = HandlerState.FINALIZED;\n}\n\nexport interface LayerTreeData {\n  paints: Types.TraceEvents.TraceEventPaint[];\n  snapshots: Types.TraceEvents.TraceEventDisplayItemListSnapshot[];\n  paintsToSnapshots: Map<Types.TraceEvents.TraceEventPaint, Types.TraceEvents.TraceEventDisplayItemListSnapshot>;\n}\n\nexport function data(): LayerTreeData {\n  return {\n    paints: Array.from(paintEvents),\n    snapshots: Array.from(snapshotEvents),\n    paintsToSnapshots: new Map(paintToSnapshotMap),\n  };\n}\n\nexport function deps(): TraceEventHandlerName[] {\n  return ['Meta'];\n}\n"]}

package/models/trace/handlers/LayoutShiftsHandler.d.ts

@@ -0,0 +1,44 @@
+import type * as Protocol from '../../../generated/protocol.js';
+import * as Types from '../types/types.js';
+import { ScoreClassification } from './PageLoadMetricsHandler.js';
+import { type TraceEventHandlerName } from './types.js';
+interface LayoutShifts {
+    clusters: LayoutShiftCluster[];
+    sessionMaxScore: number;
+    clsWindowID: number;
+    prePaintEvents: Types.TraceEvents.TraceEventPrePaint[];
+    layoutInvalidationEvents: Types.TraceEvents.TraceEventLayoutInvalidationTracking[];
+    scheduleStyleInvalidationEvents: Types.TraceEvents.TraceEventScheduleStyleInvalidationTracking[];
+    styleRecalcInvalidationEvents: Types.TraceEvents.TraceEventStyleRecalcInvalidationTracking[];
+    scoreRecords: ScoreRecord[];
+    backendNodeIds: Protocol.DOM.BackendNodeId[];
+}
+export declare const MAX_CLUSTER_DURATION: Types.Timing.MicroSeconds;
+export declare const MAX_SHIFT_TIME_DELTA: Types.Timing.MicroSeconds;
+type ScoreRecord = {
+    ts: number;
+    score: number;
+};
+export declare function initialize(): void;
+export declare function reset(): void;
+export declare function handleEvent(event: Types.TraceEvents.TraceEventData): void;
+export declare function finalize(): Promise<void>;
+export declare function data(): LayoutShifts;
+export declare function deps(): TraceEventHandlerName[];
+export declare function stateForLayoutShiftScore(score: number): ScoreClassification;
+export interface LayoutShiftCluster {
+    clusterWindow: Types.Timing.TraceWindowMicroSeconds;
+    clusterCumulativeScore: number;
+    events: Types.TraceEvents.SyntheticLayoutShift[];
+    scoreWindows: {
+        good: Types.Timing.TraceWindowMicroSeconds;
+        needsImprovement: Types.Timing.TraceWindowMicroSeconds | null;
+        bad: Types.Timing.TraceWindowMicroSeconds | null;
+    };
+}
+export declare const enum LayoutShiftsThreshold {
+    GOOD = 0,
+    NEEDS_IMPROVEMENT = 0.1,
+    BAD = 0.25
+}
+export {};