@paulirish/trace_engine 0.0.9 → 0.0.11

package/models/trace/handlers/InitiatorsHandler.js

@@ -0,0 +1,184 @@
+// 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';
+let handlerState = 1 /* HandlerState.UNINITIALIZED */;
+const lastScheduleStyleRecalcByFrame = new Map();
+// This tracks the last event that is considered to have invalidated the layout
+// for a given frame.
+// Note that although there is an InvalidateLayout event, there are also other
+// events (ScheduleStyleRecalculation) that could be the reason a layout was
+// invalidated.
+const lastInvalidationEventForFrame = new Map();
+// Important: although the event is called UpdateLayoutTree, in the UI we
+// present these to the user as "Recalculate Style". So don't get confused!
+// These are the same - just UpdateLayoutTree is what the event from Chromium
+// is called.
+const lastUpdateLayoutTreeByFrame = new Map();
+// These two maps store the same data but in different directions.
+//
+// For a given event, tell me what its initiator was. An event can only have one initiator.
+const eventToInitiatorMap = new Map();
+// For a given event, tell me what events it initiated. An event can initiate
+// multiple events, hence why the value for this map is an array.
+const initiatorToEventsMap = new Map();
+const requestAnimationFrameEventsById = new Map();
+const timerInstallEventsById = new Map();
+const requestIdleCallbackEventsById = new Map();
+const webSocketCreateEventsById = new Map();
+export function reset() {
+    lastScheduleStyleRecalcByFrame.clear();
+    lastInvalidationEventForFrame.clear();
+    lastUpdateLayoutTreeByFrame.clear();
+    timerInstallEventsById.clear();
+    eventToInitiatorMap.clear();
+    initiatorToEventsMap.clear();
+    requestAnimationFrameEventsById.clear();
+    requestIdleCallbackEventsById.clear();
+    webSocketCreateEventsById.clear();
+    handlerState = 1 /* HandlerState.UNINITIALIZED */;
+}
+export function initialize() {
+    if (handlerState !== 1 /* HandlerState.UNINITIALIZED */) {
+        throw new Error('InitiatorsHandler was not reset before being initialized');
+    }
+    handlerState = 2 /* HandlerState.INITIALIZED */;
+}
+function storeInitiator(data) {
+    eventToInitiatorMap.set(data.event, data.initiator);
+    const eventsForInitiator = initiatorToEventsMap.get(data.initiator) || [];
+    eventsForInitiator.push(data.event);
+    initiatorToEventsMap.set(data.initiator, eventsForInitiator);
+}
+export function handleEvent(event) {
+    if (Types.TraceEvents.isTraceEventScheduleStyleRecalculation(event)) {
+        lastScheduleStyleRecalcByFrame.set(event.args.data.frame, event);
+    }
+    else if (Types.TraceEvents.isTraceEventUpdateLayoutTree(event)) {
+        // IMPORTANT: although the trace event is called UpdateLayoutTree, this
+        // represents a Styles Recalculation. This event in the timeline is shown to
+        // the user as "Recalculate Styles."
+        if (event.args.beginData) {
+            // Store the last UpdateLayout event: we use this when we see an
+            // InvalidateLayout and try to figure out its initiator.
+            lastUpdateLayoutTreeByFrame.set(event.args.beginData.frame, event);
+            // If this frame has seen a ScheduleStyleRecalc event, then that event is
+            // considered to be the initiator of this StylesRecalc.
+            const scheduledStyleForFrame = lastScheduleStyleRecalcByFrame.get(event.args.beginData.frame);
+            if (scheduledStyleForFrame) {
+                storeInitiator({
+                    event,
+                    initiator: scheduledStyleForFrame,
+                });
+            }
+        }
+    }
+    else if (Types.TraceEvents.isTraceEventInvalidateLayout(event)) {
+        // By default, the InvalidateLayout event is what triggered the layout invalidation for this frame.
+        let invalidationInitiator = event;
+        // However, if we have not had any prior invalidations for this frame, we
+        // want to consider StyleRecalculation events as they might be the actual
+        // cause of this layout invalidation.
+        if (!lastInvalidationEventForFrame.has(event.args.data.frame)) {
+            // 1. If we have not had an invalidation event for this frame
+            // 2. AND we have had an UpdateLayoutTree for this frame
+            // 3. AND the UpdateLayoutTree event ended AFTER the InvalidateLayout startTime
+            // 4. AND we have an initiator for the UpdateLayoutTree event
+            // 5. Then we set the last invalidation event for this frame to be the UpdateLayoutTree's initiator.
+            const lastUpdateLayoutTreeForFrame = lastUpdateLayoutTreeByFrame.get(event.args.data.frame);
+            if (lastUpdateLayoutTreeForFrame) {
+                const { endTime } = Helpers.Timing.eventTimingsMicroSeconds(lastUpdateLayoutTreeForFrame);
+                const initiatorOfUpdateLayout = eventToInitiatorMap.get(lastUpdateLayoutTreeForFrame);
+                if (initiatorOfUpdateLayout && endTime && endTime > event.ts) {
+                    invalidationInitiator = initiatorOfUpdateLayout;
+                }
+            }
+        }
+        lastInvalidationEventForFrame.set(event.args.data.frame, invalidationInitiator);
+    }
+    else if (Types.TraceEvents.isTraceEventLayout(event)) {
+        // The initiator of a Layout event is the last Invalidation event.
+        const lastInvalidation = lastInvalidationEventForFrame.get(event.args.beginData.frame);
+        if (lastInvalidation) {
+            storeInitiator({
+                event,
+                initiator: lastInvalidation,
+            });
+        }
+        // Now clear the last invalidation for the frame: the last invalidation has been linked to a Layout event, so it cannot be the initiator for any future layouts.
+        lastInvalidationEventForFrame.delete(event.args.beginData.frame);
+    }
+    else if (Types.TraceEvents.isTraceEventRequestAnimationFrame(event)) {
+        requestAnimationFrameEventsById.set(event.args.data.id, event);
+    }
+    else if (Types.TraceEvents.isTraceEventFireAnimationFrame(event)) {
+        // If we get a fire event, that means we should have had the
+        // RequestAnimationFrame event by now. If so, we can set that as the
+        // initiator for the fire event.
+        const matchingRequestEvent = requestAnimationFrameEventsById.get(event.args.data.id);
+        if (matchingRequestEvent) {
+            storeInitiator({
+                event,
+                initiator: matchingRequestEvent,
+            });
+        }
+    }
+    else if (Types.TraceEvents.isTraceEventTimerInstall(event)) {
+        timerInstallEventsById.set(event.args.data.timerId, event);
+    }
+    else if (Types.TraceEvents.isTraceEventTimerFire(event)) {
+        const matchingInstall = timerInstallEventsById.get(event.args.data.timerId);
+        if (matchingInstall) {
+            storeInitiator({ event, initiator: matchingInstall });
+        }
+    }
+    else if (Types.TraceEvents.isTraceEventRequestIdleCallback(event)) {
+        requestIdleCallbackEventsById.set(event.args.data.id, event);
+    }
+    else if (Types.TraceEvents.isTraceEventFireIdleCallback(event)) {
+        const matchingRequestEvent = requestIdleCallbackEventsById.get(event.args.data.id);
+        if (matchingRequestEvent) {
+            storeInitiator({
+                event,
+                initiator: matchingRequestEvent,
+            });
+        }
+    }
+    else if (Types.TraceEvents.isTraceEventWebSocketCreate(event)) {
+        webSocketCreateEventsById.set(event.args.data.identifier, event);
+    }
+    else if (Types.TraceEvents.isTraceEventWebSocketSendHandshakeRequest(event)) {
+        const matchingCreateEvent = webSocketCreateEventsById.get(event.args.data.identifier);
+        if (matchingCreateEvent) {
+            storeInitiator({
+                event,
+                initiator: matchingCreateEvent,
+            });
+        }
+    }
+    else if (Types.TraceEvents.isTraceEventWebSocketSendHandshakeRequest(event) ||
+        Types.TraceEvents.isTraceEventWebSocketReceiveHandshakeResponse(event) ||
+        Types.TraceEvents.isTraceEventWebSocketDestroy(event)) {
+        const matchingCreateEvent = webSocketCreateEventsById.get(event.args.data.identifier);
+        if (matchingCreateEvent) {
+            storeInitiator({
+                event,
+                initiator: matchingCreateEvent,
+            });
+        }
+    }
+}
+export async function finalize() {
+    if (handlerState !== 2 /* HandlerState.INITIALIZED */) {
+        throw new Error('InitiatorsHandler is not initialized');
+    }
+    handlerState = 3 /* HandlerState.FINALIZED */;
+}
+export function data() {
+    return {
+        eventToInitiator: new Map(eventToInitiatorMap),
+        initiatorToEvents: new Map(initiatorToEventsMap),
+    };
+}
+//# sourceMappingURL=InitiatorsHandler.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InitiatorsHandler.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/handlers/InitiatorsHandler.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 {HandlerState} from './types.js';\n\nlet handlerState = HandlerState.UNINITIALIZED;\n\nconst lastScheduleStyleRecalcByFrame = new Map<string, Types.TraceEvents.TraceEventScheduleStyleRecalculation>();\n\n// This tracks the last event that is considered to have invalidated the layout\n// for a given frame.\n// Note that although there is an InvalidateLayout event, there are also other\n// events (ScheduleStyleRecalculation) that could be the reason a layout was\n// invalidated.\nconst lastInvalidationEventForFrame = new Map<string, Types.TraceEvents.TraceEventData>();\n\n// Important: although the event is called UpdateLayoutTree, in the UI we\n// present these to the user as \"Recalculate Style\". So don't get confused!\n// These are the same - just UpdateLayoutTree is what the event from Chromium\n// is called.\nconst lastUpdateLayoutTreeByFrame = new Map<string, Types.TraceEvents.TraceEventUpdateLayoutTree>();\n\n// These two maps store the same data but in different directions.\n//\n// For a given event, tell me what its initiator was. An event can only have one initiator.\nconst eventToInitiatorMap = new Map<Types.TraceEvents.TraceEventData, Types.TraceEvents.TraceEventData>();\n// For a given event, tell me what events it initiated. An event can initiate\n// multiple events, hence why the value for this map is an array.\nconst initiatorToEventsMap = new Map<Types.TraceEvents.TraceEventData, Types.TraceEvents.TraceEventData[]>();\n\nconst requestAnimationFrameEventsById: Map<number, Types.TraceEvents.TraceEventRequestAnimationFrame> = new Map();\nconst timerInstallEventsById: Map<number, Types.TraceEvents.TraceEventTimerInstall> = new Map();\nconst requestIdleCallbackEventsById: Map<number, Types.TraceEvents.TraceEventRequestIdleCallback> = new Map();\nconst webSocketCreateEventsById: Map<number, Types.TraceEvents.TraceEventWebSocketCreate> = new Map();\n\nexport function reset(): void {\n  lastScheduleStyleRecalcByFrame.clear();\n  lastInvalidationEventForFrame.clear();\n  lastUpdateLayoutTreeByFrame.clear();\n  timerInstallEventsById.clear();\n  eventToInitiatorMap.clear();\n  initiatorToEventsMap.clear();\n  requestAnimationFrameEventsById.clear();\n  requestIdleCallbackEventsById.clear();\n  webSocketCreateEventsById.clear();\n\n  handlerState = HandlerState.UNINITIALIZED;\n}\n\nexport function initialize(): void {\n  if (handlerState !== HandlerState.UNINITIALIZED) {\n    throw new Error('InitiatorsHandler was not reset before being initialized');\n  }\n\n  handlerState = HandlerState.INITIALIZED;\n}\n\nfunction storeInitiator(data: {initiator: Types.TraceEvents.TraceEventData, event: Types.TraceEvents.TraceEventData}):\n    void {\n  eventToInitiatorMap.set(data.event, data.initiator);\n  const eventsForInitiator = initiatorToEventsMap.get(data.initiator) || [];\n  eventsForInitiator.push(data.event);\n  initiatorToEventsMap.set(data.initiator, eventsForInitiator);\n}\n\nexport function handleEvent(event: Types.TraceEvents.TraceEventData): void {\n  if (Types.TraceEvents.isTraceEventScheduleStyleRecalculation(event)) {\n    lastScheduleStyleRecalcByFrame.set(event.args.data.frame, event);\n  } else if (Types.TraceEvents.isTraceEventUpdateLayoutTree(event)) {\n    // IMPORTANT: although the trace event is called UpdateLayoutTree, this\n    // represents a Styles Recalculation. This event in the timeline is shown to\n    // the user as \"Recalculate Styles.\"\n    if (event.args.beginData) {\n      // Store the last UpdateLayout event: we use this when we see an\n      // InvalidateLayout and try to figure out its initiator.\n      lastUpdateLayoutTreeByFrame.set(event.args.beginData.frame, event);\n\n      // If this frame has seen a ScheduleStyleRecalc event, then that event is\n      // considered to be the initiator of this StylesRecalc.\n      const scheduledStyleForFrame = lastScheduleStyleRecalcByFrame.get(event.args.beginData.frame);\n      if (scheduledStyleForFrame) {\n        storeInitiator({\n          event,\n          initiator: scheduledStyleForFrame,\n        });\n      }\n    }\n  } else if (Types.TraceEvents.isTraceEventInvalidateLayout(event)) {\n    // By default, the InvalidateLayout event is what triggered the layout invalidation for this frame.\n    let invalidationInitiator: Types.TraceEvents.TraceEventData = event;\n\n    // However, if we have not had any prior invalidations for this frame, we\n    // want to consider StyleRecalculation events as they might be the actual\n    // cause of this layout invalidation.\n    if (!lastInvalidationEventForFrame.has(event.args.data.frame)) {\n      // 1. If we have not had an invalidation event for this frame\n      // 2. AND we have had an UpdateLayoutTree for this frame\n      // 3. AND the UpdateLayoutTree event ended AFTER the InvalidateLayout startTime\n      // 4. AND we have an initiator for the UpdateLayoutTree event\n      // 5. Then we set the last invalidation event for this frame to be the UpdateLayoutTree's initiator.\n      const lastUpdateLayoutTreeForFrame = lastUpdateLayoutTreeByFrame.get(event.args.data.frame);\n      if (lastUpdateLayoutTreeForFrame) {\n        const {endTime} = Helpers.Timing.eventTimingsMicroSeconds(lastUpdateLayoutTreeForFrame);\n        const initiatorOfUpdateLayout = eventToInitiatorMap.get(lastUpdateLayoutTreeForFrame);\n\n        if (initiatorOfUpdateLayout && endTime && endTime > event.ts) {\n          invalidationInitiator = initiatorOfUpdateLayout;\n        }\n      }\n    }\n    lastInvalidationEventForFrame.set(event.args.data.frame, invalidationInitiator);\n  } else if (Types.TraceEvents.isTraceEventLayout(event)) {\n    // The initiator of a Layout event is the last Invalidation event.\n    const lastInvalidation = lastInvalidationEventForFrame.get(event.args.beginData.frame);\n    if (lastInvalidation) {\n      storeInitiator({\n        event,\n        initiator: lastInvalidation,\n      });\n    }\n    // Now clear the last invalidation for the frame: the last invalidation has been linked to a Layout event, so it cannot be the initiator for any future layouts.\n    lastInvalidationEventForFrame.delete(event.args.beginData.frame);\n  } else if (Types.TraceEvents.isTraceEventRequestAnimationFrame(event)) {\n    requestAnimationFrameEventsById.set(event.args.data.id, event);\n  } else if (Types.TraceEvents.isTraceEventFireAnimationFrame(event)) {\n    // If we get a fire event, that means we should have had the\n    // RequestAnimationFrame event by now. If so, we can set that as the\n    // initiator for the fire event.\n    const matchingRequestEvent = requestAnimationFrameEventsById.get(event.args.data.id);\n    if (matchingRequestEvent) {\n      storeInitiator({\n        event,\n        initiator: matchingRequestEvent,\n      });\n    }\n  } else if (Types.TraceEvents.isTraceEventTimerInstall(event)) {\n    timerInstallEventsById.set(event.args.data.timerId, event);\n  } else if (Types.TraceEvents.isTraceEventTimerFire(event)) {\n    const matchingInstall = timerInstallEventsById.get(event.args.data.timerId);\n    if (matchingInstall) {\n      storeInitiator({event, initiator: matchingInstall});\n    }\n  } else if (Types.TraceEvents.isTraceEventRequestIdleCallback(event)) {\n    requestIdleCallbackEventsById.set(event.args.data.id, event);\n  } else if (Types.TraceEvents.isTraceEventFireIdleCallback(event)) {\n    const matchingRequestEvent = requestIdleCallbackEventsById.get(event.args.data.id);\n    if (matchingRequestEvent) {\n      storeInitiator({\n        event,\n        initiator: matchingRequestEvent,\n      });\n    }\n  } else if (Types.TraceEvents.isTraceEventWebSocketCreate(event)) {\n    webSocketCreateEventsById.set(event.args.data.identifier, event);\n  } else if (Types.TraceEvents.isTraceEventWebSocketSendHandshakeRequest(event)) {\n    const matchingCreateEvent = webSocketCreateEventsById.get(event.args.data.identifier);\n    if (matchingCreateEvent) {\n      storeInitiator({\n        event,\n        initiator: matchingCreateEvent,\n      });\n    }\n  } else if (\n      Types.TraceEvents.isTraceEventWebSocketSendHandshakeRequest(event) ||\n      Types.TraceEvents.isTraceEventWebSocketReceiveHandshakeResponse(event) ||\n      Types.TraceEvents.isTraceEventWebSocketDestroy(event)) {\n    const matchingCreateEvent = webSocketCreateEventsById.get(event.args.data.identifier);\n    if (matchingCreateEvent) {\n      storeInitiator({\n        event,\n        initiator: matchingCreateEvent,\n      });\n    }\n  }\n}\n\nexport async function finalize(): Promise<void> {\n  if (handlerState !== HandlerState.INITIALIZED) {\n    throw new Error('InitiatorsHandler is not initialized');\n  }\n\n  handlerState = HandlerState.FINALIZED;\n}\n\nexport interface InitiatorsData {\n  eventToInitiator: Map<Types.TraceEvents.TraceEventData, Types.TraceEvents.TraceEventData>;\n  initiatorToEvents: Map<Types.TraceEvents.TraceEventData, Types.TraceEvents.TraceEventData[]>;\n}\nexport function data(): InitiatorsData {\n  return {\n    eventToInitiator: new Map(eventToInitiatorMap),\n    initiatorToEvents: new Map(initiatorToEventsMap),\n  };\n}\n"]}

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

@@ -0,0 +1,10 @@
+import * as Types from '../types/types.js';
+export declare function reset(): void;
+export declare function initialize(): void;
+export declare function handleEvent(event: Types.TraceEvents.TraceEventData): void;
+export declare function finalize(): Promise<void>;
+interface InvalidationsData {
+    invalidationsForEvent: Map<Types.TraceEvents.TraceEventData, Types.TraceEvents.SyntheticInvalidation[]>;
+}
+export declare function data(): InvalidationsData;
+export {};

package/models/trace/handlers/InvalidationsHandler.js

@@ -0,0 +1,120 @@
+// 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 Types from '../types/types.js';
+let handlerState = 1 /* HandlerState.UNINITIALIZED */;
+const invalidationsForEvent = new Map();
+let lastRecalcStyleEvent = null;
+// Used to track paints so we track invalidations correctly per paint.
+let hasPainted = false;
+const allInvalidationTrackingEvents = [];
+export function reset() {
+    handlerState = 1 /* HandlerState.UNINITIALIZED */;
+    invalidationsForEvent.clear();
+    lastRecalcStyleEvent = null;
+    allInvalidationTrackingEvents.length = 0;
+    hasPainted = false;
+}
+export function initialize() {
+    if (handlerState !== 1 /* HandlerState.UNINITIALIZED */) {
+        throw new Error('InvalidationsHandler was not reset before being initialized');
+    }
+    handlerState = 2 /* HandlerState.INITIALIZED */;
+}
+function addInvalidationToEvent(event, invalidation) {
+    const existingInvalidations = invalidationsForEvent.get(event) || [];
+    const syntheticInvalidation = {
+        ...invalidation,
+        name: 'SyntheticInvalidation',
+        frame: invalidation.args.data.frame,
+        nodeId: invalidation.args.data.nodeId,
+        rawEvent: invalidation,
+    };
+    if (invalidation.args.data.nodeName) {
+        syntheticInvalidation.nodeName = invalidation.args.data.nodeName;
+    }
+    if (invalidation.args.data.reason) {
+        syntheticInvalidation.reason = invalidation.args.data.reason;
+    }
+    if (invalidation.args.data.stackTrace) {
+        syntheticInvalidation.stackTrace = invalidation.args.data.stackTrace;
+    }
+    existingInvalidations.push(syntheticInvalidation);
+    invalidationsForEvent.set(event, existingInvalidations);
+}
+export function handleEvent(event) {
+    if (Types.TraceEvents.isTraceEventUpdateLayoutTree(event)) {
+        lastRecalcStyleEvent = event;
+        // Associate any prior invalidations with this recalc event.
+        for (const invalidation of allInvalidationTrackingEvents) {
+            if (Types.TraceEvents.isTraceEventLayoutInvalidationTracking(invalidation)) {
+                // LayoutInvalidation events cannot be associated with a LayoutTree
+                // event.
+                continue;
+            }
+            const recalcFrameId = lastRecalcStyleEvent.args.beginData?.frame;
+            if (recalcFrameId && invalidation.args.data.frame === recalcFrameId) {
+                addInvalidationToEvent(event, invalidation);
+            }
+        }
+        return;
+    }
+    if (Types.TraceEvents.isTraceEventScheduleStyleInvalidationTracking(event) ||
+        Types.TraceEvents.isTraceEventStyleRecalcInvalidationTracking(event) ||
+        Types.TraceEvents.isTraceEventStyleInvalidatorInvalidationTracking(event) ||
+        Types.TraceEvents.isTraceEventLayoutInvalidationTracking(event)) {
+        if (hasPainted) {
+            // If we have painted, then we can clear out the list of all existing
+            // invalidations, as we cannot associate them across frames.
+            allInvalidationTrackingEvents.length = 0;
+            lastRecalcStyleEvent = null;
+            hasPainted = false;
+        }
+        // Style invalidation events can occur before and during recalc styles. When we get a recalc style event (aka TraceEventUpdateLayoutTree), we check and associate any prior invalidations with it.
+        // But any invalidations that occur during a TraceEventUpdateLayoutTree
+        // event would be reported in trace events after. So each time we get an
+        // invalidation that might be due to a style recalc, we check if the
+        // timings overlap and if so associate them.
+        if (lastRecalcStyleEvent &&
+            (Types.TraceEvents.isTraceEventScheduleStyleInvalidationTracking(event) ||
+                Types.TraceEvents.isTraceEventStyleRecalcInvalidationTracking(event) ||
+                Types.TraceEvents.isTraceEventStyleInvalidatorInvalidationTracking(event))) {
+            const recalcEndTime = lastRecalcStyleEvent.ts + (lastRecalcStyleEvent.dur || 0);
+            if (event.ts >= lastRecalcStyleEvent.ts && event.ts <= recalcEndTime &&
+                lastRecalcStyleEvent.args.beginData?.frame === event.args.data.frame) {
+                addInvalidationToEvent(lastRecalcStyleEvent, event);
+            }
+        }
+        allInvalidationTrackingEvents.push(event);
+        return;
+    }
+    if (Types.TraceEvents.isTraceEventPaint(event)) {
+        // Used to ensure that we do not create relationships across frames.
+        hasPainted = true;
+        return;
+    }
+    if (Types.TraceEvents.isTraceEventLayout(event)) {
+        const layoutFrame = event.args.beginData.frame;
+        for (const invalidation of allInvalidationTrackingEvents) {
+            // The only invalidations that cause a Layout are LayoutInvalidations :)
+            if (!Types.TraceEvents.isTraceEventLayoutInvalidationTracking(invalidation)) {
+                continue;
+            }
+            if (invalidation.args.data.frame === layoutFrame) {
+                addInvalidationToEvent(event, invalidation);
+            }
+        }
+    }
+}
+export async function finalize() {
+    if (handlerState !== 2 /* HandlerState.INITIALIZED */) {
+        throw new Error('InvalidationsHandler is not initialized');
+    }
+    handlerState = 3 /* HandlerState.FINALIZED */;
+}
+export function data() {
+    return {
+        invalidationsForEvent: new Map(invalidationsForEvent),
+    };
+}
+//# sourceMappingURL=InvalidationsHandler.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InvalidationsHandler.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/handlers/InvalidationsHandler.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 Types from '../types/types.js';\n\nimport {HandlerState} from './types.js';\n\nlet handlerState = HandlerState.UNINITIALIZED;\n\nconst invalidationsForEvent = new Map<Types.TraceEvents.TraceEventData, Types.TraceEvents.SyntheticInvalidation[]>();\n\nlet lastRecalcStyleEvent: Types.TraceEvents.TraceEventUpdateLayoutTree|null = null;\n\n// Used to track paints so we track invalidations correctly per paint.\nlet hasPainted = false;\n\nconst allInvalidationTrackingEvents:\n    Array<Types.TraceEvents.TraceEventScheduleStyleInvalidationTracking|\n          Types.TraceEvents.TraceEventStyleRecalcInvalidationTracking|Types.TraceEvents\n              .TraceEventStyleInvalidatorInvalidationTracking|Types.TraceEvents.TraceEventLayoutInvalidationTracking> =\n        [];\n\nexport function reset(): void {\n  handlerState = HandlerState.UNINITIALIZED;\n  invalidationsForEvent.clear();\n  lastRecalcStyleEvent = null;\n  allInvalidationTrackingEvents.length = 0;\n  hasPainted = false;\n}\n\nexport function initialize(): void {\n  if (handlerState !== HandlerState.UNINITIALIZED) {\n    throw new Error('InvalidationsHandler was not reset before being initialized');\n  }\n\n  handlerState = HandlerState.INITIALIZED;\n}\n\nfunction addInvalidationToEvent(\n    event: Types.TraceEvents.TraceEventData,\n    invalidation: Types.TraceEvents.TraceEventScheduleStyleInvalidationTracking|\n    Types.TraceEvents.TraceEventStyleRecalcInvalidationTracking|\n    Types.TraceEvents.TraceEventStyleInvalidatorInvalidationTracking|\n    Types.TraceEvents.TraceEventLayoutInvalidationTracking): void {\n  const existingInvalidations = invalidationsForEvent.get(event) || [];\n\n  const syntheticInvalidation: Types.TraceEvents.SyntheticInvalidation = {\n    ...invalidation,\n    name: 'SyntheticInvalidation',\n    frame: invalidation.args.data.frame,\n    nodeId: invalidation.args.data.nodeId,\n    rawEvent: invalidation,\n  };\n\n  if (invalidation.args.data.nodeName) {\n    syntheticInvalidation.nodeName = invalidation.args.data.nodeName;\n  }\n  if (invalidation.args.data.reason) {\n    syntheticInvalidation.reason = invalidation.args.data.reason;\n  }\n  if (invalidation.args.data.stackTrace) {\n    syntheticInvalidation.stackTrace = invalidation.args.data.stackTrace;\n  }\n\n  existingInvalidations.push(syntheticInvalidation);\n  invalidationsForEvent.set(event, existingInvalidations);\n}\n\nexport function handleEvent(event: Types.TraceEvents.TraceEventData): void {\n  if (Types.TraceEvents.isTraceEventUpdateLayoutTree(event)) {\n    lastRecalcStyleEvent = event;\n\n    // Associate any prior invalidations with this recalc event.\n    for (const invalidation of allInvalidationTrackingEvents) {\n      if (Types.TraceEvents.isTraceEventLayoutInvalidationTracking(invalidation)) {\n        // LayoutInvalidation events cannot be associated with a LayoutTree\n        // event.\n        continue;\n      }\n\n      const recalcFrameId = lastRecalcStyleEvent.args.beginData?.frame;\n\n      if (recalcFrameId && invalidation.args.data.frame === recalcFrameId) {\n        addInvalidationToEvent(event, invalidation);\n      }\n    }\n    return;\n  }\n\n  if (Types.TraceEvents.isTraceEventScheduleStyleInvalidationTracking(event) ||\n      Types.TraceEvents.isTraceEventStyleRecalcInvalidationTracking(event) ||\n      Types.TraceEvents.isTraceEventStyleInvalidatorInvalidationTracking(event) ||\n      Types.TraceEvents.isTraceEventLayoutInvalidationTracking(event)) {\n    if (hasPainted) {\n      // If we have painted, then we can clear out the list of all existing\n      // invalidations, as we cannot associate them across frames.\n      allInvalidationTrackingEvents.length = 0;\n      lastRecalcStyleEvent = null;\n      hasPainted = false;\n    }\n\n    // Style invalidation events can occur before and during recalc styles. When we get a recalc style event (aka TraceEventUpdateLayoutTree), we check and associate any prior invalidations with it.\n    // But any invalidations that occur during a TraceEventUpdateLayoutTree\n    // event would be reported in trace events after. So each time we get an\n    // invalidation that might be due to a style recalc, we check if the\n    // timings overlap and if so associate them.\n    if (lastRecalcStyleEvent &&\n        (Types.TraceEvents.isTraceEventScheduleStyleInvalidationTracking(event) ||\n         Types.TraceEvents.isTraceEventStyleRecalcInvalidationTracking(event) ||\n         Types.TraceEvents.isTraceEventStyleInvalidatorInvalidationTracking(event))) {\n      const recalcEndTime = lastRecalcStyleEvent.ts + (lastRecalcStyleEvent.dur || 0);\n      if (event.ts >= lastRecalcStyleEvent.ts && event.ts <= recalcEndTime &&\n          lastRecalcStyleEvent.args.beginData?.frame === event.args.data.frame) {\n        addInvalidationToEvent(lastRecalcStyleEvent, event);\n      }\n    }\n\n    allInvalidationTrackingEvents.push(event);\n    return;\n  }\n\n  if (Types.TraceEvents.isTraceEventPaint(event)) {\n    // Used to ensure that we do not create relationships across frames.\n    hasPainted = true;\n    return;\n  }\n\n  if (Types.TraceEvents.isTraceEventLayout(event)) {\n    const layoutFrame = event.args.beginData.frame;\n    for (const invalidation of allInvalidationTrackingEvents) {\n      // The only invalidations that cause a Layout are LayoutInvalidations :)\n      if (!Types.TraceEvents.isTraceEventLayoutInvalidationTracking(invalidation)) {\n        continue;\n      }\n\n      if (invalidation.args.data.frame === layoutFrame) {\n        addInvalidationToEvent(event, invalidation);\n      }\n    }\n  }\n}\n\nexport async function finalize(): Promise<void> {\n  if (handlerState !== HandlerState.INITIALIZED) {\n    throw new Error('InvalidationsHandler is not initialized');\n  }\n\n  handlerState = HandlerState.FINALIZED;\n}\n\ninterface InvalidationsData {\n  invalidationsForEvent: Map<Types.TraceEvents.TraceEventData, Types.TraceEvents.SyntheticInvalidation[]>;\n}\n\nexport function data(): InvalidationsData {\n  return {\n    invalidationsForEvent: new Map(invalidationsForEvent),\n  };\n}\n"]}

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

@@ -0,0 +1,5 @@
+import * as Types from '../types/types.js';
+import type * as Protocol from '../../../generated/protocol.js';
+export declare function reset(): void;
+export declare function handleEvent(event: Types.TraceEvents.TraceEventData): void;
+export declare function data(): Map<Protocol.DOM.BackendNodeId, Types.TraceEvents.TraceEventLargestImagePaintCandidate>;

package/models/trace/handlers/LargestImagePaintHandler.js

@@ -0,0 +1,38 @@
+// Copyright 2022 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 Types from '../types/types.js';
+/**
+ * If the LCP resource was an image, and that image was fetched over the
+ * network, we want to be able to find the network request in order to construct
+ * the critical path for an LCP image.
+ * Within the trace file there are `LargestImagePaint::Candidate` events.
+ * Within their data object, they contain a `DOMNodeId` property, which maps to
+ * the DOM Node ID for that image.
+ *
+ * This id maps exactly to the `data.nodeId` property that a
+ * `LargestContentfulPaint::Candidate` will have. So, when we find an image
+ * paint candidate, we can store it, keying it on the node ID.
+ * Then, when it comes to finding the network request for an LCP image, we can
+ *
+ * use the nodeId from the LCP candidate to find the image candidate. That image
+ * candidate also contains a `imageUrl` property, which will have the full URL
+ * to the image.
+ **/
+const imageByDOMNodeId = new Map();
+export function reset() {
+    imageByDOMNodeId.clear();
+}
+export function handleEvent(event) {
+    if (!Types.TraceEvents.isTraceEventLargestImagePaintCandidate(event)) {
+        return;
+    }
+    if (!event.args.data) {
+        return;
+    }
+    imageByDOMNodeId.set(event.args.data.DOMNodeId, event);
+}
+export function data() {
+    return new Map(imageByDOMNodeId);
+}
+//# sourceMappingURL=LargestImagePaintHandler.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LargestImagePaintHandler.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/handlers/LargestImagePaintHandler.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,KAAK,MAAM,mBAAmB,CAAC;AAE3C;;;;;;;;;;;;;;;;IAgBI;AACJ,MAAM,gBAAgB,GAAG,IAAI,GAAG,EAAsF,CAAC;AAEvH,MAAM,UAAU,KAAK;IACnB,gBAAgB,CAAC,KAAK,EAAE,CAAC;AAC3B,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,KAAuC;IACjE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sCAAsC,CAAC,KAAK,CAAC,EAAE;QACpE,OAAO;KACR;IAED,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,EAAE;QACpB,OAAO;KACR;IAED,gBAAgB,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;AACzD,CAAC;AAED,MAAM,UAAU,IAAI;IAClB,OAAO,IAAI,GAAG,CAAC,gBAAgB,CAAC,CAAC;AACnC,CAAC","sourcesContent":["// Copyright 2022 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 Types from '../types/types.js';\nimport type * as Protocol from '../../../generated/protocol.js';\n/**\n * If the LCP resource was an image, and that image was fetched over the\n * network, we want to be able to find the network request in order to construct\n * the critical path for an LCP image.\n * Within the trace file there are `LargestImagePaint::Candidate` events.\n * Within their data object, they contain a `DOMNodeId` property, which maps to\n * the DOM Node ID for that image.\n *\n * This id maps exactly to the `data.nodeId` property that a\n * `LargestContentfulPaint::Candidate` will have. So, when we find an image\n * paint candidate, we can store it, keying it on the node ID.\n * Then, when it comes to finding the network request for an LCP image, we can\n *\n * use the nodeId from the LCP candidate to find the image candidate. That image\n * candidate also contains a `imageUrl` property, which will have the full URL\n * to the image.\n **/\nconst imageByDOMNodeId = new Map<Protocol.DOM.BackendNodeId, Types.TraceEvents.TraceEventLargestImagePaintCandidate>();\n\nexport function reset(): void {\n  imageByDOMNodeId.clear();\n}\n\nexport function handleEvent(event: Types.TraceEvents.TraceEventData): void {\n  if (!Types.TraceEvents.isTraceEventLargestImagePaintCandidate(event)) {\n    return;\n  }\n\n  if (!event.args.data) {\n    return;\n  }\n\n  imageByDOMNodeId.set(event.args.data.DOMNodeId, event);\n}\n\nexport function data(): Map<Protocol.DOM.BackendNodeId, Types.TraceEvents.TraceEventLargestImagePaintCandidate> {\n  return new Map(imageByDOMNodeId);\n}\n"]}

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

@@ -0,0 +1,5 @@
+import type * as Protocol from '../../../generated/protocol.js';
+import * as Types from '../types/types.js';
+export declare function reset(): void;
+export declare function handleEvent(event: Types.TraceEvents.TraceEventData): void;
+export declare function data(): Map<Protocol.DOM.BackendNodeId, Types.TraceEvents.TraceEventLargestTextPaintCandidate>;

package/models/trace/handlers/LargestTextPaintHandler.js

@@ -0,0 +1,26 @@
+// Copyright 2022 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 Types from '../types/types.js';
+/**
+ * A trace file will contain all the text paints that were candidates for the
+ * LargestTextPaint. If an LCP event is text, it will point to one of these
+ * candidates, so we store them by their DOM Node ID.
+ **/
+const textPaintByDOMNodeId = new Map();
+export function reset() {
+    textPaintByDOMNodeId.clear();
+}
+export function handleEvent(event) {
+    if (!Types.TraceEvents.isTraceEventLargestTextPaintCandidate(event)) {
+        return;
+    }
+    if (!event.args.data) {
+        return;
+    }
+    textPaintByDOMNodeId.set(event.args.data.DOMNodeId, event);
+}
+export function data() {
+    return new Map(textPaintByDOMNodeId);
+}
+//# sourceMappingURL=LargestTextPaintHandler.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LargestTextPaintHandler.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/handlers/LargestTextPaintHandler.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAG7B,OAAO,KAAK,KAAK,MAAM,mBAAmB,CAAC;AAC3C;;;;IAII;AACJ,MAAM,oBAAoB,GACtB,IAAI,GAAG,EAAqF,CAAC;AAEjG,MAAM,UAAU,KAAK;IACnB,oBAAoB,CAAC,KAAK,EAAE,CAAC;AAC/B,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,KAAuC;IACjE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,qCAAqC,CAAC,KAAK,CAAC,EAAE;QACnE,OAAO;KACR;IAED,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,EAAE;QACpB,OAAO;KACR;IAED,oBAAoB,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;AAC7D,CAAC;AAED,MAAM,UAAU,IAAI;IAClB,OAAO,IAAI,GAAG,CAAC,oBAAoB,CAAC,CAAC;AACvC,CAAC","sourcesContent":["// Copyright 2022 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 type * as Protocol from '../../../generated/protocol.js';\nimport * as Types from '../types/types.js';\n/**\n * A trace file will contain all the text paints that were candidates for the\n * LargestTextPaint. If an LCP event is text, it will point to one of these\n * candidates, so we store them by their DOM Node ID.\n **/\nconst textPaintByDOMNodeId =\n    new Map<Protocol.DOM.BackendNodeId, Types.TraceEvents.TraceEventLargestTextPaintCandidate>();\n\nexport function reset(): void {\n  textPaintByDOMNodeId.clear();\n}\n\nexport function handleEvent(event: Types.TraceEvents.TraceEventData): void {\n  if (!Types.TraceEvents.isTraceEventLargestTextPaintCandidate(event)) {\n    return;\n  }\n\n  if (!event.args.data) {\n    return;\n  }\n\n  textPaintByDOMNodeId.set(event.args.data.DOMNodeId, event);\n}\n\nexport function data(): Map<Protocol.DOM.BackendNodeId, Types.TraceEvents.TraceEventLargestTextPaintCandidate> {\n  return new Map(textPaintByDOMNodeId);\n}\n"]}

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

@@ -0,0 +1,13 @@
+import * as Types from '../types/types.js';
+import { type TraceEventHandlerName } from './types.js';
+export declare function reset(): void;
+export declare function initialize(): void;
+export declare function handleEvent(event: Types.TraceEvents.TraceEventData): void;
+export declare function finalize(): Promise<void>;
+export interface LayerTreeData {
+    paints: Types.TraceEvents.TraceEventPaint[];
+    snapshots: Types.TraceEvents.TraceEventDisplayItemListSnapshot[];
+    paintsToSnapshots: Map<Types.TraceEvents.TraceEventPaint, Types.TraceEvents.TraceEventDisplayItemListSnapshot>;
+}
+export declare function data(): LayerTreeData;
+export declare function deps(): TraceEventHandlerName[];

package/models/trace/handlers/LayerTreeHandler.js

@@ -0,0 +1,116 @@
+// 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 = new Map();
+let lastPaintForLayerId = {};
+let currentMainFrameLayerTreeId = null;
+const updateLayerEvents = [];
+const relevantEvents = [];
+export function reset() {
+    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 !== 1 /* HandlerState.UNINITIALIZED */) {
+        throw new Error('LayerTree Handler was not reset before being initialized');
+    }
+    handlerState = 2 /* HandlerState.INITIALIZED */;
+}
+export function handleEvent(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 !== 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);
+        }
+    }
+    handlerState = 3 /* HandlerState.FINALIZED */;
+}
+export function data() {
+    return {
+        paints: Array.from(paintEvents),
+        snapshots: Array.from(snapshotEvents),
+        paintsToSnapshots: new Map(paintToSnapshotMap),
+    };
+}
+export function deps() {
+    return ['Meta'];
+}
+//# sourceMappingURL=LayerTreeHandler.js.map

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

@@ -0,0 +1 @@
+{"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"]}