@paulirish/trace_engine 0.0.10 → 0.0.12

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

@@ -1,7 +1 @@
-{
-  "version": 3,
-  "sources": ["../../../../../../../front_end/models/trace/handlers/LayoutShiftsHandler.ts"],
-  "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 Platform from '../../../core/platform/platform.js';\nimport type * as Protocol from '../../../generated/protocol.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport * as Types from '../types/types.js';\n\nimport {data as metaHandlerData} from './MetaHandler.js';\nimport {ScoreClassification} from './PageLoadMetricsHandler.js';\nimport {HandlerState, type TraceEventHandlerName} from './types.js';\n\n// We start with a score of zero and step through all Layout Shift records from\n// all renderers. Each record not only tells us which renderer it is, but also\n// the unweighted and weighted scores. The unweighted score is the score we would\n// get if the renderer were the only one in the viewport. The weighted score, on\n// the other hand, accounts for how much of the viewport that particular render\n// takes up when the shift happened. An ad frame in the corner of the viewport\n// that shifts is considered less disruptive, therefore, than if it were taking\n// up the whole viewport.\n//\n// Next, we step through all the records from all renderers and add the weighted\n// score to a running total across all of the renderers. We create a new \"cluster\"\n// and reset the running total when:\n//\n// 1. We observe a outermost frame navigation, or\n// 2. When there's a gap between records of > 1s, or\n// 3. When there's more than 5 seconds of continuous layout shifting.\n//\n// Note that for it to be Cumulative Layout Shift in the sense described in the\n// documentation we would need to guarantee that we are tracking from navigation\n// to unload. However, we don't make any such guarantees here (since a developer\n// can record and stop when they please), so we support the cluster approach,\n// and we can give them a score, but it is effectively a \"session\" score, a\n// score for the given recording, and almost certainly not the\n// navigation-to-unload CLS score.\n\ninterface LayoutShifts {\n  clusters: LayoutShiftCluster[];\n  sessionMaxScore: number;\n  // The session window which contains the SessionMaxScore\n  clsWindowID: number;\n  // We use these to calculate root causes for a given LayoutShift\n  prePaintEvents: Types.TraceEvents.TraceEventPrePaint[];\n  layoutInvalidationEvents: Types.TraceEvents.TraceEventLayoutInvalidationTracking[];\n  scheduleStyleInvalidationEvents: Types.TraceEvents.TraceEventScheduleStyleInvalidationTracking[];\n  styleRecalcInvalidationEvents: Types.TraceEvents.TraceEventStyleRecalcInvalidationTracking[];\n  scoreRecords: ScoreRecord[];\n  backendNodeIds: Protocol.DOM.BackendNodeId[];\n}\n\n// This represents the maximum #time we will allow a cluster to go before we\n// reset it.\nexport const MAX_CLUSTER_DURATION = Helpers.Timing.millisecondsToMicroseconds(Types.Timing.MilliSeconds(5000));\n\n// This represents the maximum #time we will allow between layout shift events\n// before considering it to be the start of a new cluster.\nexport const MAX_SHIFT_TIME_DELTA = Helpers.Timing.millisecondsToMicroseconds(Types.Timing.MilliSeconds(1000));\n\n// Layout shifts are reported globally to the developer, irrespective of which\n// frame they originated in. However, each process does have its own individual\n// CLS score, so we need to segment by process. This means Layout Shifts from\n// sites with one process (no subframes, or subframes from the same origin)\n// will be reported together. In the case of multiple renderers (frames across\n// different origins), we offer the developer the ability to switch renderer in\n// the UI.\nconst layoutShiftEvents: Types.TraceEvents.TraceEventLayoutShift[] = [];\n\n// These events denote potential node resizings. We store them to link captured\n// layout shifts to the resizing of unsized elements.\nconst layoutInvalidationEvents: Types.TraceEvents.TraceEventLayoutInvalidationTracking[] = [];\nconst scheduleStyleInvalidationEvents: Types.TraceEvents.TraceEventScheduleStyleInvalidationTracking[] = [];\nconst styleRecalcInvalidationEvents: Types.TraceEvents.TraceEventStyleRecalcInvalidationTracking[] = [];\n\nconst backendNodeIds = new Set<Protocol.DOM.BackendNodeId>();\n\n// Layout shifts happen during PrePaint as part of the rendering lifecycle.\n// We determine if a LayoutInvalidation event is a potential root cause of a layout\n// shift if the next PrePaint after the LayoutInvalidation is the parent\n// node of such shift.\nconst prePaintEvents: Types.TraceEvents.TraceEventPrePaint[] = [];\n\nlet sessionMaxScore = 0;\n\nlet clsWindowID = -1;\n\nconst clusters: LayoutShiftCluster[] = [];\n\n// Represents a point in time in which a  LS score change\n// was recorded.\ntype ScoreRecord = {\n  ts: number,\n  score: number,\n};\n\n// The complete timeline of LS score changes in a trace.\n// Includes drops to 0 when session windows end.\nconst scoreRecords: ScoreRecord[] = [];\n\nlet handlerState = HandlerState.UNINITIALIZED;\n\nexport function initialize(): void {\n  if (handlerState !== HandlerState.UNINITIALIZED) {\n    throw new Error('LayoutShifts Handler was not reset');\n  }\n  handlerState = HandlerState.INITIALIZED;\n}\n\nexport function reset(): void {\n  handlerState = HandlerState.UNINITIALIZED;\n  layoutShiftEvents.length = 0;\n  layoutInvalidationEvents.length = 0;\n  scheduleStyleInvalidationEvents.length = 0;\n  styleRecalcInvalidationEvents.length = 0;\n  prePaintEvents.length = 0;\n  backendNodeIds.clear();\n  clusters.length = 0;\n  sessionMaxScore = 0;\n  scoreRecords.length = 0;\n  clsWindowID = -1;\n}\n\nexport function handleEvent(event: Types.TraceEvents.TraceEventData): void {\n  if (handlerState !== HandlerState.INITIALIZED) {\n    throw new Error('Handler is not initialized');\n  }\n\n  if (Types.TraceEvents.isTraceEventLayoutShift(event) && !event.args.data?.had_recent_input) {\n    layoutShiftEvents.push(event);\n    return;\n  }\n  if (Types.TraceEvents.isTraceEventLayoutInvalidationTracking(event)) {\n    layoutInvalidationEvents.push(event);\n    return;\n  }\n  if (Types.TraceEvents.isTraceEventScheduleStyleInvalidationTracking(event)) {\n    scheduleStyleInvalidationEvents.push(event);\n  }\n  if (Types.TraceEvents.isTraceEventStyleRecalcInvalidationTracking(event)) {\n    styleRecalcInvalidationEvents.push(event);\n  }\n  if (Types.TraceEvents.isTraceEventPrePaint(event)) {\n    prePaintEvents.push(event);\n    return;\n  }\n}\n\nfunction traceWindowFromTime(time: Types.Timing.MicroSeconds): Types.Timing.TraceWindowMicroSeconds {\n  return {\n    min: time,\n    max: time,\n    range: Types.Timing.MicroSeconds(0),\n  };\n}\n\nfunction updateTraceWindowMax(\n    traceWindow: Types.Timing.TraceWindowMicroSeconds, newMax: Types.Timing.MicroSeconds): void {\n  traceWindow.max = newMax;\n  traceWindow.range = Types.Timing.MicroSeconds(traceWindow.max - traceWindow.min);\n}\n\nfunction buildScoreRecords(): void {\n  const {traceBounds} = metaHandlerData();\n  scoreRecords.push({ts: traceBounds.min, score: 0});\n\n  for (const cluster of clusters) {\n    let clusterScore = 0;\n    if (cluster.events[0].args.data) {\n      scoreRecords.push({ts: cluster.clusterWindow.min, score: cluster.events[0].args.data.weighted_score_delta});\n    }\n    for (let i = 0; i < cluster.events.length; i++) {\n      const event = cluster.events[i];\n      if (!event.args.data) {\n        continue;\n      }\n      clusterScore += event.args.data.weighted_score_delta;\n      scoreRecords.push({ts: event.ts, score: clusterScore});\n    }\n    scoreRecords.push({ts: cluster.clusterWindow.max, score: 0});\n  }\n}\n\n/**\n * Collects backend node ids coming from LayoutShift and LayoutInvalidation\n * events.\n */\nfunction collectNodes(): void {\n  backendNodeIds.clear();\n\n  // Collect the node ids present in the shifts.\n  for (const layoutShift of layoutShiftEvents) {\n    if (!layoutShift.args.data?.impacted_nodes) {\n      continue;\n    }\n    for (const node of layoutShift.args.data.impacted_nodes) {\n      backendNodeIds.add(node.node_id);\n    }\n  }\n\n  // Collect the node ids present in LayoutInvalidation & scheduleStyleInvalidation events.\n  for (const layoutInvalidation of layoutInvalidationEvents) {\n    if (!layoutInvalidation.args.data?.nodeId) {\n      continue;\n    }\n    backendNodeIds.add(layoutInvalidation.args.data.nodeId);\n  }\n  for (const scheduleStyleInvalidation of scheduleStyleInvalidationEvents) {\n    if (!scheduleStyleInvalidation.args.data?.nodeId) {\n      continue;\n    }\n    backendNodeIds.add(scheduleStyleInvalidation.args.data.nodeId);\n  }\n}\n\nexport async function finalize(): Promise<void> {\n  // Ensure the events are sorted by #time ascending.\n  layoutShiftEvents.sort((a, b) => a.ts - b.ts);\n  prePaintEvents.sort((a, b) => a.ts - b.ts);\n  layoutInvalidationEvents.sort((a, b) => a.ts - b.ts);\n\n  // Each function transforms the data used by the next, as such the invoke order\n  // is important.\n  await buildLayoutShiftsClusters();\n  buildScoreRecords();\n  collectNodes();\n  handlerState = HandlerState.FINALIZED;\n}\n\nasync function buildLayoutShiftsClusters(): Promise<void> {\n  const {navigationsByFrameId, mainFrameId, traceBounds} = metaHandlerData();\n  const navigations = navigationsByFrameId.get(mainFrameId) || [];\n  if (layoutShiftEvents.length === 0) {\n    return;\n  }\n  let firstShiftTime = layoutShiftEvents[0].ts;\n  let lastShiftTime = layoutShiftEvents[0].ts;\n  let lastShiftNavigation = null;\n  // Now step through each and create clusters.\n  // A cluster is equivalent to a session window (see https://web.dev/cls/#what-is-cls).\n  // To make the line chart clear, we explicitly demark the limits of each session window\n  // by starting the cumulative score of the window at the time of the first layout shift\n  // and ending it (dropping the line back to 0) when the window ends according to the\n  // thresholds (MAX_CLUSTER_DURATION, MAX_SHIFT_TIME_DELTA).\n  for (const event of layoutShiftEvents) {\n    // First detect if either the cluster duration or the #time between this and\n    // the last shift has been exceeded.\n    const clusterDurationExceeded = event.ts - firstShiftTime > MAX_CLUSTER_DURATION;\n    const maxTimeDeltaSinceLastShiftExceeded = event.ts - lastShiftTime > MAX_SHIFT_TIME_DELTA;\n\n    // Next take a look at navigations. If between this and the last shift we have navigated,\n    // note it.\n    const currentShiftNavigation = Platform.ArrayUtilities.nearestIndexFromEnd(navigations, nav => nav.ts < event.ts);\n    const hasNavigated = lastShiftNavigation !== currentShiftNavigation && currentShiftNavigation !== null;\n\n    // If any of the above criteria are met or if we don't have any cluster yet we should\n    // start a new one.\n    if (clusterDurationExceeded || maxTimeDeltaSinceLastShiftExceeded || hasNavigated || !clusters.length) {\n      // The cluster starts #time should be the timestamp of the first layout shift in it.\n      const clusterStartTime = event.ts;\n\n      // If the last session window ended because the max delta time between shifts\n      // was exceeded set the endtime to MAX_SHIFT_TIME_DELTA microseconds after the\n      // last shift in the session.\n      const endTimeByMaxSessionDuration = clusterDurationExceeded ? firstShiftTime + MAX_CLUSTER_DURATION : Infinity;\n\n      // If the last session window ended because the max session duration was\n      // surpassed, set the endtime so that the window length = MAX_CLUSTER_DURATION;\n      const endTimeByMaxShiftGap = maxTimeDeltaSinceLastShiftExceeded ? lastShiftTime + MAX_SHIFT_TIME_DELTA : Infinity;\n\n      // If there was a navigation during the last window, close it at the time\n      // of the navigation.\n      const endTimeByNavigation = hasNavigated ? navigations[currentShiftNavigation].ts : Infinity;\n\n      // End the previous cluster at the time of the first of the criteria above that was met.\n      const previousClusterEndTime = Math.min(endTimeByMaxSessionDuration, endTimeByMaxShiftGap, endTimeByNavigation);\n\n      // If there is an existing cluster update its closing time.\n      if (clusters.length > 0) {\n        const currentCluster = clusters[clusters.length - 1];\n        updateTraceWindowMax(currentCluster.clusterWindow, Types.Timing.MicroSeconds(previousClusterEndTime));\n      }\n\n      clusters.push({\n        events: [],\n        clusterWindow: traceWindowFromTime(clusterStartTime),\n        clusterCumulativeScore: 0,\n        scoreWindows: {\n          good: traceWindowFromTime(clusterStartTime),\n          needsImprovement: null,\n          bad: null,\n        },\n      });\n\n      firstShiftTime = clusterStartTime;\n    }\n\n    // Given the above we should have a cluster available, so pick the most\n    // recent one and append the shift, bump its score and window values accordingly.\n    const currentCluster = clusters[clusters.length - 1];\n    const timeFromNavigation = currentShiftNavigation !== null ?\n        Types.Timing.MicroSeconds(event.ts - navigations[currentShiftNavigation].ts) :\n        undefined;\n\n    currentCluster.clusterCumulativeScore += event.args.data ? event.args.data.weighted_score_delta : 0;\n    if (!event.args.data) {\n      continue;\n    }\n    const shift: Types.TraceEvents.SyntheticLayoutShift = {\n      ...event,\n      args: {\n        frame: event.args.frame,\n        data: {\n          ...event.args.data,\n          rawEvent: event,\n        },\n      },\n      parsedData: {\n        timeFromNavigation,\n        cumulativeWeightedScoreInWindow: currentCluster.clusterCumulativeScore,\n        // The score of the session window is temporarily set to 0 just\n        // to initialize it. Since we need to get the score of all shifts\n        // in the session window to determine its value, its definite\n        // value is set when stepping through the built clusters.\n        sessionWindowData: {cumulativeWindowScore: 0, id: clusters.length},\n      },\n    };\n    currentCluster.events.push(shift);\n    updateTraceWindowMax(currentCluster.clusterWindow, event.ts);\n\n    lastShiftTime = event.ts;\n    lastShiftNavigation = currentShiftNavigation;\n  }\n\n  // Now step through each cluster and set up the times at which the value\n  // goes from Good, to needs improvement, to Bad. Note that if there is a\n  // large jump we may go from Good to Bad without ever creating a Needs\n  // Improvement window at all.\n  for (const cluster of clusters) {\n    let weightedScore = 0;\n    let windowID = -1;\n    // If this is the last cluster update its window. The cluster duration is determined\n    // by the minimum between: time to next navigation, trace end time, time to maximum\n    // cluster duration and time to maximum gap between layout shifts.\n    if (cluster === clusters[clusters.length - 1]) {\n      const clusterEndByMaxDuration = MAX_CLUSTER_DURATION + cluster.clusterWindow.min;\n      const clusterEndByMaxGap = cluster.clusterWindow.max + MAX_SHIFT_TIME_DELTA;\n      const nextNavigationIndex =\n          Platform.ArrayUtilities.nearestIndexFromBeginning(navigations, nav => nav.ts > cluster.clusterWindow.max);\n      const nextNavigationTime = nextNavigationIndex ? navigations[nextNavigationIndex].ts : Infinity;\n      const clusterEnd = Math.min(clusterEndByMaxDuration, clusterEndByMaxGap, traceBounds.max, nextNavigationTime);\n      updateTraceWindowMax(cluster.clusterWindow, Types.Timing.MicroSeconds(clusterEnd));\n    }\n    for (const shift of cluster.events) {\n      weightedScore += shift.args.data ? shift.args.data.weighted_score_delta : 0;\n      windowID = shift.parsedData.sessionWindowData.id;\n      const ts = shift.ts;\n      // Update the the CLS score of this shift's session window now that\n      // we have it.\n      shift.parsedData.sessionWindowData.cumulativeWindowScore = cluster.clusterCumulativeScore;\n      if (weightedScore < LayoutShiftsThreshold.NEEDS_IMPROVEMENT) {\n        // Expand the Good window.\n        updateTraceWindowMax(cluster.scoreWindows.good, ts);\n      } else if (\n          weightedScore >= LayoutShiftsThreshold.NEEDS_IMPROVEMENT && weightedScore < LayoutShiftsThreshold.BAD) {\n        if (!cluster.scoreWindows.needsImprovement) {\n          // Close the Good window, and open the needs improvement window.\n          updateTraceWindowMax(cluster.scoreWindows.good, Types.Timing.MicroSeconds(ts - 1));\n          cluster.scoreWindows.needsImprovement = traceWindowFromTime(ts);\n        }\n\n        // Expand the needs improvement window.\n        updateTraceWindowMax(cluster.scoreWindows.needsImprovement, ts);\n      } else if (weightedScore >= LayoutShiftsThreshold.BAD) {\n        if (!cluster.scoreWindows.bad) {\n          // We may jump from Good to Bad here, so update whichever window is open.\n          if (cluster.scoreWindows.needsImprovement) {\n            updateTraceWindowMax(cluster.scoreWindows.needsImprovement, Types.Timing.MicroSeconds(ts - 1));\n          } else {\n            updateTraceWindowMax(cluster.scoreWindows.good, Types.Timing.MicroSeconds(ts - 1));\n          }\n\n          cluster.scoreWindows.bad = traceWindowFromTime(shift.ts);\n        }\n\n        // Expand the Bad window.\n        updateTraceWindowMax(cluster.scoreWindows.bad, ts);\n      }\n\n      // At this point the windows are set by the timestamps of the events, but the\n      // next cluster begins at the timestamp of its first event. As such we now\n      // need to expand the score window to the end of the cluster, and we do so\n      // by using the Bad widow if it's there, or the NI window, or finally the\n      // Good window.\n      if (cluster.scoreWindows.bad) {\n        updateTraceWindowMax(cluster.scoreWindows.bad, cluster.clusterWindow.max);\n      } else if (cluster.scoreWindows.needsImprovement) {\n        updateTraceWindowMax(cluster.scoreWindows.needsImprovement, cluster.clusterWindow.max);\n      } else {\n        updateTraceWindowMax(cluster.scoreWindows.good, cluster.clusterWindow.max);\n      }\n    }\n    if (weightedScore > sessionMaxScore) {\n      clsWindowID = windowID;\n      sessionMaxScore = weightedScore;\n    }\n  }\n}\n\nexport function data(): LayoutShifts {\n  if (handlerState !== HandlerState.FINALIZED) {\n    throw new Error('Layout Shifts Handler is not finalized');\n  }\n\n  return {\n    clusters: [...clusters],\n    sessionMaxScore: sessionMaxScore,\n    clsWindowID,\n    prePaintEvents: [...prePaintEvents],\n    layoutInvalidationEvents: [...layoutInvalidationEvents],\n    scheduleStyleInvalidationEvents: [...scheduleStyleInvalidationEvents],\n    styleRecalcInvalidationEvents: [],\n    scoreRecords: [...scoreRecords],\n    backendNodeIds: [...backendNodeIds],\n  };\n}\n\nexport function deps(): TraceEventHandlerName[] {\n  return ['Screenshots', 'Meta'];\n}\n\nexport function stateForLayoutShiftScore(score: number): ScoreClassification {\n  let state = ScoreClassification.GOOD;\n  if (score >= LayoutShiftsThreshold.NEEDS_IMPROVEMENT) {\n    state = ScoreClassification.OK;\n  }\n\n  if (score >= LayoutShiftsThreshold.BAD) {\n    state = ScoreClassification.BAD;\n  }\n\n  return state;\n}\n\nexport interface LayoutShiftCluster {\n  clusterWindow: Types.Timing.TraceWindowMicroSeconds;\n  clusterCumulativeScore: number;\n  events: Types.TraceEvents.SyntheticLayoutShift[];\n  // For convenience we split apart the cluster into good, NI, and bad windows.\n  // Since a cluster may remain in the good window, we mark NI and bad as being\n  // possibly null.\n  scoreWindows: {\n    good: Types.Timing.TraceWindowMicroSeconds,\n    needsImprovement: Types.Timing.TraceWindowMicroSeconds|null,\n    bad: Types.Timing.TraceWindowMicroSeconds|null,\n  };\n}\n\n// Based on https://web.dev/cls/\nexport const enum LayoutShiftsThreshold {\n  GOOD = 0,\n  NEEDS_IMPROVEMENT = 0.1,\n  BAD = 0.25,\n}\n"],
-  "mappings": "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",
-  "names": []
-}
+{"version":3,"file":"LayoutShiftsHandler.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/handlers/LayoutShiftsHandler.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,QAAQ,MAAM,oCAAoC,CAAC;AAE/D,OAAO,KAAK,OAAO,MAAM,uBAAuB,CAAC;AACjD,OAAO,KAAK,KAAK,MAAM,mBAAmB,CAAC;AAE3C,OAAO,EAAC,IAAI,IAAI,eAAe,EAAC,MAAM,kBAAkB,CAAC;AA2CzD,4EAA4E;AAC5E,YAAY;AACZ,MAAM,CAAC,MAAM,oBAAoB,GAAG,OAAO,CAAC,MAAM,CAAC,0BAA0B,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;AAE/G,8EAA8E;AAC9E,0DAA0D;AAC1D,MAAM,CAAC,MAAM,oBAAoB,GAAG,OAAO,CAAC,MAAM,CAAC,0BAA0B,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;AAE/G,8EAA8E;AAC9E,+EAA+E;AAC/E,6EAA6E;AAC7E,2EAA2E;AAC3E,8EAA8E;AAC9E,+EAA+E;AAC/E,UAAU;AACV,MAAM,iBAAiB,GAA8C,EAAE,CAAC;AAExE,+EAA+E;AAC/E,qDAAqD;AACrD,MAAM,wBAAwB,GAA6D,EAAE,CAAC;AAC9F,MAAM,+BAA+B,GAAoE,EAAE,CAAC;AAC5G,MAAM,6BAA6B,GAAkE,EAAE,CAAC;AAExG,MAAM,cAAc,GAAG,IAAI,GAAG,EAA8B,CAAC;AAE7D,2EAA2E;AAC3E,mFAAmF;AACnF,wEAAwE;AACxE,sBAAsB;AACtB,MAAM,cAAc,GAA2C,EAAE,CAAC;AAElE,IAAI,eAAe,GAAG,CAAC,CAAC;AAExB,IAAI,WAAW,GAAG,CAAC,CAAC,CAAC;AAErB,MAAM,QAAQ,GAAyB,EAAE,CAAC;AAS1C,wDAAwD;AACxD,gDAAgD;AAChD,MAAM,YAAY,GAAkB,EAAE,CAAC;AAEvC,IAAI,YAAY,qCAA6B,CAAC;AAE9C,MAAM,UAAU,UAAU;IACxB,IAAI,YAAY,uCAA+B,EAAE;QAC/C,MAAM,IAAI,KAAK,CAAC,oCAAoC,CAAC,CAAC;KACvD;IACD,YAAY,mCAA2B,CAAC;AAC1C,CAAC;AAED,MAAM,UAAU,KAAK;IACnB,YAAY,qCAA6B,CAAC;IAC1C,iBAAiB,CAAC,MAAM,GAAG,CAAC,CAAC;IAC7B,wBAAwB,CAAC,MAAM,GAAG,CAAC,CAAC;IACpC,+BAA+B,CAAC,MAAM,GAAG,CAAC,CAAC;IAC3C,6BAA6B,CAAC,MAAM,GAAG,CAAC,CAAC;IACzC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC;IAC1B,cAAc,CAAC,KAAK,EAAE,CAAC;IACvB,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC;IACpB,eAAe,GAAG,CAAC,CAAC;IACpB,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;IACxB,WAAW,GAAG,CAAC,CAAC,CAAC;AACnB,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,KAAuC;IACjE,IAAI,YAAY,qCAA6B,EAAE;QAC7C,MAAM,IAAI,KAAK,CAAC,4BAA4B,CAAC,CAAC;KAC/C;IAED,IAAI,KAAK,CAAC,WAAW,CAAC,uBAAuB,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,EAAE,gBAAgB,EAAE;QAC1F,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC9B,OAAO;KACR;IACD,IAAI,KAAK,CAAC,WAAW,CAAC,sCAAsC,CAAC,KAAK,CAAC,EAAE;QACnE,wBAAwB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACrC,OAAO;KACR;IACD,IAAI,KAAK,CAAC,WAAW,CAAC,6CAA6C,CAAC,KAAK,CAAC,EAAE;QAC1E,+BAA+B,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KAC7C;IACD,IAAI,KAAK,CAAC,WAAW,CAAC,2CAA2C,CAAC,KAAK,CAAC,EAAE;QACxE,6BAA6B,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KAC3C;IACD,IAAI,KAAK,CAAC,WAAW,CAAC,oBAAoB,CAAC,KAAK,CAAC,EAAE;QACjD,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC3B,OAAO;KACR;AACH,CAAC;AAED,SAAS,mBAAmB,CAAC,IAA+B;IAC1D,OAAO;QACL,GAAG,EAAE,IAAI;QACT,GAAG,EAAE,IAAI;QACT,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC;KACpC,CAAC;AACJ,CAAC;AAED,SAAS,oBAAoB,CACzB,WAAiD,EAAE,MAAiC;IACtF,WAAW,CAAC,GAAG,GAAG,MAAM,CAAC;IACzB,WAAW,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,WAAW,CAAC,GAAG,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC;AACnF,CAAC;AAED,SAAS,iBAAiB;IACxB,MAAM,EAAC,WAAW,EAAC,GAAG,eAAe,EAAE,CAAC;IACxC,YAAY,CAAC,IAAI,CAAC,EAAC,EAAE,EAAE,WAAW,CAAC,GAAG,EAAE,KAAK,EAAE,CAAC,EAAC,CAAC,CAAC;IAEnD,KAAK,MAAM,OAAO,IAAI,QAAQ,EAAE;QAC9B,IAAI,YAAY,GAAG,CAAC,CAAC;QACrB,IAAI,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE;YAC/B,YAAY,CAAC,IAAI,CAAC,EAAC,EAAE,EAAE,OAAO,CAAC,aAAa,CAAC,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,oBAAoB,EAAC,CAAC,CAAC;SAC7G;QACD,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YAC9C,MAAM,KAAK,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;YAChC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,EAAE;gBACpB,SAAS;aACV;YACD,YAAY,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC;YACrD,YAAY,CAAC,IAAI,CAAC,EAAC,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,YAAY,EAAC,CAAC,CAAC;SACxD;QACD,YAAY,CAAC,IAAI,CAAC,EAAC,EAAE,EAAE,OAAO,CAAC,aAAa,CAAC,GAAG,EAAE,KAAK,EAAE,CAAC,EAAC,CAAC,CAAC;KAC9D;AACH,CAAC;AAED;;;GAGG;AACH,SAAS,YAAY;IACnB,cAAc,CAAC,KAAK,EAAE,CAAC;IAEvB,8CAA8C;IAC9C,KAAK,MAAM,WAAW,IAAI,iBAAiB,EAAE;QAC3C,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,EAAE,cAAc,EAAE;YAC1C,SAAS;SACV;QACD,KAAK,MAAM,IAAI,IAAI,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;YACvD,cAAc,CAAC,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;SAClC;KACF;IAED,yFAAyF;IACzF,KAAK,MAAM,kBAAkB,IAAI,wBAAwB,EAAE;QACzD,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE;YACzC,SAAS;SACV;QACD,cAAc,CAAC,GAAG,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KACzD;IACD,KAAK,MAAM,yBAAyB,IAAI,+BAA+B,EAAE;QACvE,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE;YAChD,SAAS;SACV;QACD,cAAc,CAAC,GAAG,CAAC,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KAChE;AACH,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,QAAQ;IAC5B,mDAAmD;IACnD,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC;IAC9C,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC;IAC3C,wBAAwB,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC;IAErD,+EAA+E;IAC/E,gBAAgB;IAChB,MAAM,yBAAyB,EAAE,CAAC;IAClC,iBAAiB,EAAE,CAAC;IACpB,YAAY,EAAE,CAAC;IACf,YAAY,iCAAyB,CAAC;AACxC,CAAC;AAED,KAAK,UAAU,yBAAyB;IACtC,MAAM,EAAC,oBAAoB,EAAE,WAAW,EAAE,WAAW,EAAC,GAAG,eAAe,EAAE,CAAC;IAC3E,MAAM,WAAW,GAAG,oBAAoB,CAAC,GAAG,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;IAChE,IAAI,iBAAiB,CAAC,MAAM,KAAK,CAAC,EAAE;QAClC,OAAO;KACR;IACD,IAAI,cAAc,GAAG,iBAAiB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC7C,IAAI,aAAa,GAAG,iBAAiB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5C,IAAI,mBAAmB,GAAG,IAAI,CAAC;IAC/B,6CAA6C;IAC7C,sFAAsF;IACtF,uFAAuF;IACvF,uFAAuF;IACvF,oFAAoF;IACpF,2DAA2D;IAC3D,KAAK,MAAM,KAAK,IAAI,iBAAiB,EAAE;QACrC,4EAA4E;QAC5E,oCAAoC;QACpC,MAAM,uBAAuB,GAAG,KAAK,CAAC,EAAE,GAAG,cAAc,GAAG,oBAAoB,CAAC;QACjF,MAAM,kCAAkC,GAAG,KAAK,CAAC,EAAE,GAAG,aAAa,GAAG,oBAAoB,CAAC;QAE3F,yFAAyF;QACzF,WAAW;QACX,MAAM,sBAAsB,GAAG,QAAQ,CAAC,cAAc,CAAC,mBAAmB,CAAC,WAAW,EAAE,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC;QAClH,MAAM,YAAY,GAAG,mBAAmB,KAAK,sBAAsB,IAAI,sBAAsB,KAAK,IAAI,CAAC;QAEvG,qFAAqF;QACrF,mBAAmB;QACnB,IAAI,uBAAuB,IAAI,kCAAkC,IAAI,YAAY,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE;YACrG,oFAAoF;YACpF,MAAM,gBAAgB,GAAG,KAAK,CAAC,EAAE,CAAC;YAElC,6EAA6E;YAC7E,8EAA8E;YAC9E,6BAA6B;YAC7B,MAAM,2BAA2B,GAAG,uBAAuB,CAAC,CAAC,CAAC,cAAc,GAAG,oBAAoB,CAAC,CAAC,CAAC,QAAQ,CAAC;YAE/G,wEAAwE;YACxE,+EAA+E;YAC/E,MAAM,oBAAoB,GAAG,kCAAkC,CAAC,CAAC,CAAC,aAAa,GAAG,oBAAoB,CAAC,CAAC,CAAC,QAAQ,CAAC;YAElH,yEAAyE;YACzE,qBAAqB;YACrB,MAAM,mBAAmB,GAAG,YAAY,CAAC,CAAC,CAAC,WAAW,CAAC,sBAAsB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC;YAE7F,wFAAwF;YACxF,MAAM,sBAAsB,GAAG,IAAI,CAAC,GAAG,CAAC,2BAA2B,EAAE,oBAAoB,EAAE,mBAAmB,CAAC,CAAC;YAEhH,2DAA2D;YAC3D,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;gBACvB,MAAM,cAAc,GAAG,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;gBACrD,oBAAoB,CAAC,cAAc,CAAC,aAAa,EAAE,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,sBAAsB,CAAC,CAAC,CAAC;aACvG;YAED,QAAQ,CAAC,IAAI,CAAC;gBACZ,MAAM,EAAE,EAAE;gBACV,aAAa,EAAE,mBAAmB,CAAC,gBAAgB,CAAC;gBACpD,sBAAsB,EAAE,CAAC;gBACzB,YAAY,EAAE;oBACZ,IAAI,EAAE,mBAAmB,CAAC,gBAAgB,CAAC;oBAC3C,gBAAgB,EAAE,IAAI;oBACtB,GAAG,EAAE,IAAI;iBACV;aACF,CAAC,CAAC;YAEH,cAAc,GAAG,gBAAgB,CAAC;SACnC;QAED,uEAAuE;QACvE,iFAAiF;QACjF,MAAM,cAAc,GAAG,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACrD,MAAM,kBAAkB,GAAG,sBAAsB,KAAK,IAAI,CAAC,CAAC;YACxD,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC,EAAE,GAAG,WAAW,CAAC,sBAAsB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;YAC9E,SAAS,CAAC;QAEd,cAAc,CAAC,sBAAsB,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC,CAAC;QACpG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,EAAE;YACpB,SAAS;SACV;QACD,MAAM,KAAK,GAA2C;YACpD,GAAG,KAAK;YACR,IAAI,EAAE;gBACJ,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,KAAK;gBACvB,IAAI,EAAE;oBACJ,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI;oBAClB,QAAQ,EAAE,KAAK;iBAChB;aACF;YACD,UAAU,EAAE;gBACV,kBAAkB;gBAClB,+BAA+B,EAAE,cAAc,CAAC,sBAAsB;gBACtE,+DAA+D;gBAC/D,iEAAiE;gBACjE,6DAA6D;gBAC7D,yDAAyD;gBACzD,iBAAiB,EAAE,EAAC,qBAAqB,EAAE,CAAC,EAAE,EAAE,EAAE,QAAQ,CAAC,MAAM,EAAC;aACnE;SACF,CAAC;QACF,cAAc,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAClC,oBAAoB,CAAC,cAAc,CAAC,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC;QAE7D,aAAa,GAAG,KAAK,CAAC,EAAE,CAAC;QACzB,mBAAmB,GAAG,sBAAsB,CAAC;KAC9C;IAED,wEAAwE;IACxE,wEAAwE;IACxE,sEAAsE;IACtE,6BAA6B;IAC7B,KAAK,MAAM,OAAO,IAAI,QAAQ,EAAE;QAC9B,IAAI,aAAa,GAAG,CAAC,CAAC;QACtB,IAAI,QAAQ,GAAG,CAAC,CAAC,CAAC;QAClB,oFAAoF;QACpF,mFAAmF;QACnF,kEAAkE;QAClE,IAAI,OAAO,KAAK,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE;YAC7C,MAAM,uBAAuB,GAAG,oBAAoB,GAAG,OAAO,CAAC,aAAa,CAAC,GAAG,CAAC;YACjF,MAAM,kBAAkB,GAAG,OAAO,CAAC,aAAa,CAAC,GAAG,GAAG,oBAAoB,CAAC;YAC5E,MAAM,mBAAmB,GACrB,QAAQ,CAAC,cAAc,CAAC,yBAAyB,CAAC,WAAW,EAAE,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,GAAG,OAAO,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;YAC9G,MAAM,kBAAkB,GAAG,mBAAmB,CAAC,CAAC,CAAC,WAAW,CAAC,mBAAmB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC;YAChG,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,uBAAuB,EAAE,kBAAkB,EAAE,WAAW,CAAC,GAAG,EAAE,kBAAkB,CAAC,CAAC;YAC9G,oBAAoB,CAAC,OAAO,CAAC,aAAa,EAAE,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC;SACpF;QACD,KAAK,MAAM,KAAK,IAAI,OAAO,CAAC,MAAM,EAAE;YAClC,aAAa,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC,CAAC;YAC5E,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,EAAE,CAAC;YACjD,MAAM,EAAE,GAAG,KAAK,CAAC,EAAE,CAAC;YACpB,mEAAmE;YACnE,cAAc;YACd,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,qBAAqB,GAAG,OAAO,CAAC,sBAAsB,CAAC;YAC1F,IAAI,aAAa,oDAA0C,EAAE;gBAC3D,0BAA0B;gBAC1B,oBAAoB,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;aACrD;iBAAM,IACH,aAAa,qDAA2C,IAAI,aAAa,uCAA4B,EAAE;gBACzG,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,gBAAgB,EAAE;oBAC1C,gEAAgE;oBAChE,oBAAoB,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC;oBACnF,OAAO,CAAC,YAAY,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,EAAE,CAAC,CAAC;iBACjE;gBAED,uCAAuC;gBACvC,oBAAoB,CAAC,OAAO,CAAC,YAAY,CAAC,gBAAgB,EAAE,EAAE,CAAC,CAAC;aACjE;iBAAM,IAAI,aAAa,wCAA6B,EAAE;gBACrD,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,GAAG,EAAE;oBAC7B,yEAAyE;oBACzE,IAAI,OAAO,CAAC,YAAY,CAAC,gBAAgB,EAAE;wBACzC,oBAAoB,CAAC,OAAO,CAAC,YAAY,CAAC,gBAAgB,EAAE,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC;qBAChG;yBAAM;wBACL,oBAAoB,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC;qBACpF;oBAED,OAAO,CAAC,YAAY,CAAC,GAAG,GAAG,mBAAmB,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;iBAC1D;gBAED,yBAAyB;gBACzB,oBAAoB,CAAC,OAAO,CAAC,YAAY,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;aACpD;YAED,6EAA6E;YAC7E,0EAA0E;YAC1E,0EAA0E;YAC1E,yEAAyE;YACzE,eAAe;YACf,IAAI,OAAO,CAAC,YAAY,CAAC,GAAG,EAAE;gBAC5B,oBAAoB,CAAC,OAAO,CAAC,YAAY,CAAC,GAAG,EAAE,OAAO,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;aAC3E;iBAAM,IAAI,OAAO,CAAC,YAAY,CAAC,gBAAgB,EAAE;gBAChD,oBAAoB,CAAC,OAAO,CAAC,YAAY,CAAC,gBAAgB,EAAE,OAAO,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;aACxF;iBAAM;gBACL,oBAAoB,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,OAAO,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;aAC5E;SACF;QACD,IAAI,aAAa,GAAG,eAAe,EAAE;YACnC,WAAW,GAAG,QAAQ,CAAC;YACvB,eAAe,GAAG,aAAa,CAAC;SACjC;KACF;AACH,CAAC;AAED,MAAM,UAAU,IAAI;IAClB,IAAI,YAAY,mCAA2B,EAAE;QAC3C,MAAM,IAAI,KAAK,CAAC,wCAAwC,CAAC,CAAC;KAC3D;IAED,OAAO;QACL,QAAQ,EAAE,CAAC,GAAG,QAAQ,CAAC;QACvB,eAAe,EAAE,eAAe;QAChC,WAAW;QACX,cAAc,EAAE,CAAC,GAAG,cAAc,CAAC;QACnC,wBAAwB,EAAE,CAAC,GAAG,wBAAwB,CAAC;QACvD,+BAA+B,EAAE,CAAC,GAAG,+BAA+B,CAAC;QACrE,6BAA6B,EAAE,EAAE;QACjC,YAAY,EAAE,CAAC,GAAG,YAAY,CAAC;QAC/B,cAAc,EAAE,CAAC,GAAG,cAAc,CAAC;KACpC,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,IAAI;IAClB,OAAO,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;AACjC,CAAC;AAED,MAAM,UAAU,wBAAwB,CAAC,KAAa;IACpD,IAAI,KAAK,wCAA2B,CAAC;IACrC,IAAI,KAAK,qDAA2C,EAAE;QACpD,KAAK,oCAAyB,CAAC;KAChC;IAED,IAAI,KAAK,wCAA6B,EAAE;QACtC,KAAK,sCAA0B,CAAC;KACjC;IAED,OAAO,KAAK,CAAC;AACf,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 Platform from '../../../core/platform/platform.js';\nimport type * as Protocol from '../../../generated/protocol.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport * as Types from '../types/types.js';\n\nimport {data as metaHandlerData} from './MetaHandler.js';\nimport {ScoreClassification} from './PageLoadMetricsHandler.js';\nimport {HandlerState, type TraceEventHandlerName} from './types.js';\n\n// We start with a score of zero and step through all Layout Shift records from\n// all renderers. Each record not only tells us which renderer it is, but also\n// the unweighted and weighted scores. The unweighted score is the score we would\n// get if the renderer were the only one in the viewport. The weighted score, on\n// the other hand, accounts for how much of the viewport that particular render\n// takes up when the shift happened. An ad frame in the corner of the viewport\n// that shifts is considered less disruptive, therefore, than if it were taking\n// up the whole viewport.\n//\n// Next, we step through all the records from all renderers and add the weighted\n// score to a running total across all of the renderers. We create a new \"cluster\"\n// and reset the running total when:\n//\n// 1. We observe a outermost frame navigation, or\n// 2. When there's a gap between records of > 1s, or\n// 3. When there's more than 5 seconds of continuous layout shifting.\n//\n// Note that for it to be Cumulative Layout Shift in the sense described in the\n// documentation we would need to guarantee that we are tracking from navigation\n// to unload. However, we don't make any such guarantees here (since a developer\n// can record and stop when they please), so we support the cluster approach,\n// and we can give them a score, but it is effectively a \"session\" score, a\n// score for the given recording, and almost certainly not the\n// navigation-to-unload CLS score.\n\ninterface LayoutShifts {\n  clusters: LayoutShiftCluster[];\n  sessionMaxScore: number;\n  // The session window which contains the SessionMaxScore\n  clsWindowID: number;\n  // We use these to calculate root causes for a given LayoutShift\n  prePaintEvents: Types.TraceEvents.TraceEventPrePaint[];\n  layoutInvalidationEvents: Types.TraceEvents.TraceEventLayoutInvalidationTracking[];\n  scheduleStyleInvalidationEvents: Types.TraceEvents.TraceEventScheduleStyleInvalidationTracking[];\n  styleRecalcInvalidationEvents: Types.TraceEvents.TraceEventStyleRecalcInvalidationTracking[];\n  scoreRecords: ScoreRecord[];\n  backendNodeIds: Protocol.DOM.BackendNodeId[];\n}\n\n// This represents the maximum #time we will allow a cluster to go before we\n// reset it.\nexport const MAX_CLUSTER_DURATION = Helpers.Timing.millisecondsToMicroseconds(Types.Timing.MilliSeconds(5000));\n\n// This represents the maximum #time we will allow between layout shift events\n// before considering it to be the start of a new cluster.\nexport const MAX_SHIFT_TIME_DELTA = Helpers.Timing.millisecondsToMicroseconds(Types.Timing.MilliSeconds(1000));\n\n// Layout shifts are reported globally to the developer, irrespective of which\n// frame they originated in. However, each process does have its own individual\n// CLS score, so we need to segment by process. This means Layout Shifts from\n// sites with one process (no subframes, or subframes from the same origin)\n// will be reported together. In the case of multiple renderers (frames across\n// different origins), we offer the developer the ability to switch renderer in\n// the UI.\nconst layoutShiftEvents: Types.TraceEvents.TraceEventLayoutShift[] = [];\n\n// These events denote potential node resizings. We store them to link captured\n// layout shifts to the resizing of unsized elements.\nconst layoutInvalidationEvents: Types.TraceEvents.TraceEventLayoutInvalidationTracking[] = [];\nconst scheduleStyleInvalidationEvents: Types.TraceEvents.TraceEventScheduleStyleInvalidationTracking[] = [];\nconst styleRecalcInvalidationEvents: Types.TraceEvents.TraceEventStyleRecalcInvalidationTracking[] = [];\n\nconst backendNodeIds = new Set<Protocol.DOM.BackendNodeId>();\n\n// Layout shifts happen during PrePaint as part of the rendering lifecycle.\n// We determine if a LayoutInvalidation event is a potential root cause of a layout\n// shift if the next PrePaint after the LayoutInvalidation is the parent\n// node of such shift.\nconst prePaintEvents: Types.TraceEvents.TraceEventPrePaint[] = [];\n\nlet sessionMaxScore = 0;\n\nlet clsWindowID = -1;\n\nconst clusters: LayoutShiftCluster[] = [];\n\n// Represents a point in time in which a  LS score change\n// was recorded.\ntype ScoreRecord = {\n  ts: number,\n  score: number,\n};\n\n// The complete timeline of LS score changes in a trace.\n// Includes drops to 0 when session windows end.\nconst scoreRecords: ScoreRecord[] = [];\n\nlet handlerState = HandlerState.UNINITIALIZED;\n\nexport function initialize(): void {\n  if (handlerState !== HandlerState.UNINITIALIZED) {\n    throw new Error('LayoutShifts Handler was not reset');\n  }\n  handlerState = HandlerState.INITIALIZED;\n}\n\nexport function reset(): void {\n  handlerState = HandlerState.UNINITIALIZED;\n  layoutShiftEvents.length = 0;\n  layoutInvalidationEvents.length = 0;\n  scheduleStyleInvalidationEvents.length = 0;\n  styleRecalcInvalidationEvents.length = 0;\n  prePaintEvents.length = 0;\n  backendNodeIds.clear();\n  clusters.length = 0;\n  sessionMaxScore = 0;\n  scoreRecords.length = 0;\n  clsWindowID = -1;\n}\n\nexport function handleEvent(event: Types.TraceEvents.TraceEventData): void {\n  if (handlerState !== HandlerState.INITIALIZED) {\n    throw new Error('Handler is not initialized');\n  }\n\n  if (Types.TraceEvents.isTraceEventLayoutShift(event) && !event.args.data?.had_recent_input) {\n    layoutShiftEvents.push(event);\n    return;\n  }\n  if (Types.TraceEvents.isTraceEventLayoutInvalidationTracking(event)) {\n    layoutInvalidationEvents.push(event);\n    return;\n  }\n  if (Types.TraceEvents.isTraceEventScheduleStyleInvalidationTracking(event)) {\n    scheduleStyleInvalidationEvents.push(event);\n  }\n  if (Types.TraceEvents.isTraceEventStyleRecalcInvalidationTracking(event)) {\n    styleRecalcInvalidationEvents.push(event);\n  }\n  if (Types.TraceEvents.isTraceEventPrePaint(event)) {\n    prePaintEvents.push(event);\n    return;\n  }\n}\n\nfunction traceWindowFromTime(time: Types.Timing.MicroSeconds): Types.Timing.TraceWindowMicroSeconds {\n  return {\n    min: time,\n    max: time,\n    range: Types.Timing.MicroSeconds(0),\n  };\n}\n\nfunction updateTraceWindowMax(\n    traceWindow: Types.Timing.TraceWindowMicroSeconds, newMax: Types.Timing.MicroSeconds): void {\n  traceWindow.max = newMax;\n  traceWindow.range = Types.Timing.MicroSeconds(traceWindow.max - traceWindow.min);\n}\n\nfunction buildScoreRecords(): void {\n  const {traceBounds} = metaHandlerData();\n  scoreRecords.push({ts: traceBounds.min, score: 0});\n\n  for (const cluster of clusters) {\n    let clusterScore = 0;\n    if (cluster.events[0].args.data) {\n      scoreRecords.push({ts: cluster.clusterWindow.min, score: cluster.events[0].args.data.weighted_score_delta});\n    }\n    for (let i = 0; i < cluster.events.length; i++) {\n      const event = cluster.events[i];\n      if (!event.args.data) {\n        continue;\n      }\n      clusterScore += event.args.data.weighted_score_delta;\n      scoreRecords.push({ts: event.ts, score: clusterScore});\n    }\n    scoreRecords.push({ts: cluster.clusterWindow.max, score: 0});\n  }\n}\n\n/**\n * Collects backend node ids coming from LayoutShift and LayoutInvalidation\n * events.\n */\nfunction collectNodes(): void {\n  backendNodeIds.clear();\n\n  // Collect the node ids present in the shifts.\n  for (const layoutShift of layoutShiftEvents) {\n    if (!layoutShift.args.data?.impacted_nodes) {\n      continue;\n    }\n    for (const node of layoutShift.args.data.impacted_nodes) {\n      backendNodeIds.add(node.node_id);\n    }\n  }\n\n  // Collect the node ids present in LayoutInvalidation & scheduleStyleInvalidation events.\n  for (const layoutInvalidation of layoutInvalidationEvents) {\n    if (!layoutInvalidation.args.data?.nodeId) {\n      continue;\n    }\n    backendNodeIds.add(layoutInvalidation.args.data.nodeId);\n  }\n  for (const scheduleStyleInvalidation of scheduleStyleInvalidationEvents) {\n    if (!scheduleStyleInvalidation.args.data?.nodeId) {\n      continue;\n    }\n    backendNodeIds.add(scheduleStyleInvalidation.args.data.nodeId);\n  }\n}\n\nexport async function finalize(): Promise<void> {\n  // Ensure the events are sorted by #time ascending.\n  layoutShiftEvents.sort((a, b) => a.ts - b.ts);\n  prePaintEvents.sort((a, b) => a.ts - b.ts);\n  layoutInvalidationEvents.sort((a, b) => a.ts - b.ts);\n\n  // Each function transforms the data used by the next, as such the invoke order\n  // is important.\n  await buildLayoutShiftsClusters();\n  buildScoreRecords();\n  collectNodes();\n  handlerState = HandlerState.FINALIZED;\n}\n\nasync function buildLayoutShiftsClusters(): Promise<void> {\n  const {navigationsByFrameId, mainFrameId, traceBounds} = metaHandlerData();\n  const navigations = navigationsByFrameId.get(mainFrameId) || [];\n  if (layoutShiftEvents.length === 0) {\n    return;\n  }\n  let firstShiftTime = layoutShiftEvents[0].ts;\n  let lastShiftTime = layoutShiftEvents[0].ts;\n  let lastShiftNavigation = null;\n  // Now step through each and create clusters.\n  // A cluster is equivalent to a session window (see https://web.dev/cls/#what-is-cls).\n  // To make the line chart clear, we explicitly demark the limits of each session window\n  // by starting the cumulative score of the window at the time of the first layout shift\n  // and ending it (dropping the line back to 0) when the window ends according to the\n  // thresholds (MAX_CLUSTER_DURATION, MAX_SHIFT_TIME_DELTA).\n  for (const event of layoutShiftEvents) {\n    // First detect if either the cluster duration or the #time between this and\n    // the last shift has been exceeded.\n    const clusterDurationExceeded = event.ts - firstShiftTime > MAX_CLUSTER_DURATION;\n    const maxTimeDeltaSinceLastShiftExceeded = event.ts - lastShiftTime > MAX_SHIFT_TIME_DELTA;\n\n    // Next take a look at navigations. If between this and the last shift we have navigated,\n    // note it.\n    const currentShiftNavigation = Platform.ArrayUtilities.nearestIndexFromEnd(navigations, nav => nav.ts < event.ts);\n    const hasNavigated = lastShiftNavigation !== currentShiftNavigation && currentShiftNavigation !== null;\n\n    // If any of the above criteria are met or if we don't have any cluster yet we should\n    // start a new one.\n    if (clusterDurationExceeded || maxTimeDeltaSinceLastShiftExceeded || hasNavigated || !clusters.length) {\n      // The cluster starts #time should be the timestamp of the first layout shift in it.\n      const clusterStartTime = event.ts;\n\n      // If the last session window ended because the max delta time between shifts\n      // was exceeded set the endtime to MAX_SHIFT_TIME_DELTA microseconds after the\n      // last shift in the session.\n      const endTimeByMaxSessionDuration = clusterDurationExceeded ? firstShiftTime + MAX_CLUSTER_DURATION : Infinity;\n\n      // If the last session window ended because the max session duration was\n      // surpassed, set the endtime so that the window length = MAX_CLUSTER_DURATION;\n      const endTimeByMaxShiftGap = maxTimeDeltaSinceLastShiftExceeded ? lastShiftTime + MAX_SHIFT_TIME_DELTA : Infinity;\n\n      // If there was a navigation during the last window, close it at the time\n      // of the navigation.\n      const endTimeByNavigation = hasNavigated ? navigations[currentShiftNavigation].ts : Infinity;\n\n      // End the previous cluster at the time of the first of the criteria above that was met.\n      const previousClusterEndTime = Math.min(endTimeByMaxSessionDuration, endTimeByMaxShiftGap, endTimeByNavigation);\n\n      // If there is an existing cluster update its closing time.\n      if (clusters.length > 0) {\n        const currentCluster = clusters[clusters.length - 1];\n        updateTraceWindowMax(currentCluster.clusterWindow, Types.Timing.MicroSeconds(previousClusterEndTime));\n      }\n\n      clusters.push({\n        events: [],\n        clusterWindow: traceWindowFromTime(clusterStartTime),\n        clusterCumulativeScore: 0,\n        scoreWindows: {\n          good: traceWindowFromTime(clusterStartTime),\n          needsImprovement: null,\n          bad: null,\n        },\n      });\n\n      firstShiftTime = clusterStartTime;\n    }\n\n    // Given the above we should have a cluster available, so pick the most\n    // recent one and append the shift, bump its score and window values accordingly.\n    const currentCluster = clusters[clusters.length - 1];\n    const timeFromNavigation = currentShiftNavigation !== null ?\n        Types.Timing.MicroSeconds(event.ts - navigations[currentShiftNavigation].ts) :\n        undefined;\n\n    currentCluster.clusterCumulativeScore += event.args.data ? event.args.data.weighted_score_delta : 0;\n    if (!event.args.data) {\n      continue;\n    }\n    const shift: Types.TraceEvents.SyntheticLayoutShift = {\n      ...event,\n      args: {\n        frame: event.args.frame,\n        data: {\n          ...event.args.data,\n          rawEvent: event,\n        },\n      },\n      parsedData: {\n        timeFromNavigation,\n        cumulativeWeightedScoreInWindow: currentCluster.clusterCumulativeScore,\n        // The score of the session window is temporarily set to 0 just\n        // to initialize it. Since we need to get the score of all shifts\n        // in the session window to determine its value, its definite\n        // value is set when stepping through the built clusters.\n        sessionWindowData: {cumulativeWindowScore: 0, id: clusters.length},\n      },\n    };\n    currentCluster.events.push(shift);\n    updateTraceWindowMax(currentCluster.clusterWindow, event.ts);\n\n    lastShiftTime = event.ts;\n    lastShiftNavigation = currentShiftNavigation;\n  }\n\n  // Now step through each cluster and set up the times at which the value\n  // goes from Good, to needs improvement, to Bad. Note that if there is a\n  // large jump we may go from Good to Bad without ever creating a Needs\n  // Improvement window at all.\n  for (const cluster of clusters) {\n    let weightedScore = 0;\n    let windowID = -1;\n    // If this is the last cluster update its window. The cluster duration is determined\n    // by the minimum between: time to next navigation, trace end time, time to maximum\n    // cluster duration and time to maximum gap between layout shifts.\n    if (cluster === clusters[clusters.length - 1]) {\n      const clusterEndByMaxDuration = MAX_CLUSTER_DURATION + cluster.clusterWindow.min;\n      const clusterEndByMaxGap = cluster.clusterWindow.max + MAX_SHIFT_TIME_DELTA;\n      const nextNavigationIndex =\n          Platform.ArrayUtilities.nearestIndexFromBeginning(navigations, nav => nav.ts > cluster.clusterWindow.max);\n      const nextNavigationTime = nextNavigationIndex ? navigations[nextNavigationIndex].ts : Infinity;\n      const clusterEnd = Math.min(clusterEndByMaxDuration, clusterEndByMaxGap, traceBounds.max, nextNavigationTime);\n      updateTraceWindowMax(cluster.clusterWindow, Types.Timing.MicroSeconds(clusterEnd));\n    }\n    for (const shift of cluster.events) {\n      weightedScore += shift.args.data ? shift.args.data.weighted_score_delta : 0;\n      windowID = shift.parsedData.sessionWindowData.id;\n      const ts = shift.ts;\n      // Update the the CLS score of this shift's session window now that\n      // we have it.\n      shift.parsedData.sessionWindowData.cumulativeWindowScore = cluster.clusterCumulativeScore;\n      if (weightedScore < LayoutShiftsThreshold.NEEDS_IMPROVEMENT) {\n        // Expand the Good window.\n        updateTraceWindowMax(cluster.scoreWindows.good, ts);\n      } else if (\n          weightedScore >= LayoutShiftsThreshold.NEEDS_IMPROVEMENT && weightedScore < LayoutShiftsThreshold.BAD) {\n        if (!cluster.scoreWindows.needsImprovement) {\n          // Close the Good window, and open the needs improvement window.\n          updateTraceWindowMax(cluster.scoreWindows.good, Types.Timing.MicroSeconds(ts - 1));\n          cluster.scoreWindows.needsImprovement = traceWindowFromTime(ts);\n        }\n\n        // Expand the needs improvement window.\n        updateTraceWindowMax(cluster.scoreWindows.needsImprovement, ts);\n      } else if (weightedScore >= LayoutShiftsThreshold.BAD) {\n        if (!cluster.scoreWindows.bad) {\n          // We may jump from Good to Bad here, so update whichever window is open.\n          if (cluster.scoreWindows.needsImprovement) {\n            updateTraceWindowMax(cluster.scoreWindows.needsImprovement, Types.Timing.MicroSeconds(ts - 1));\n          } else {\n            updateTraceWindowMax(cluster.scoreWindows.good, Types.Timing.MicroSeconds(ts - 1));\n          }\n\n          cluster.scoreWindows.bad = traceWindowFromTime(shift.ts);\n        }\n\n        // Expand the Bad window.\n        updateTraceWindowMax(cluster.scoreWindows.bad, ts);\n      }\n\n      // At this point the windows are set by the timestamps of the events, but the\n      // next cluster begins at the timestamp of its first event. As such we now\n      // need to expand the score window to the end of the cluster, and we do so\n      // by using the Bad widow if it's there, or the NI window, or finally the\n      // Good window.\n      if (cluster.scoreWindows.bad) {\n        updateTraceWindowMax(cluster.scoreWindows.bad, cluster.clusterWindow.max);\n      } else if (cluster.scoreWindows.needsImprovement) {\n        updateTraceWindowMax(cluster.scoreWindows.needsImprovement, cluster.clusterWindow.max);\n      } else {\n        updateTraceWindowMax(cluster.scoreWindows.good, cluster.clusterWindow.max);\n      }\n    }\n    if (weightedScore > sessionMaxScore) {\n      clsWindowID = windowID;\n      sessionMaxScore = weightedScore;\n    }\n  }\n}\n\nexport function data(): LayoutShifts {\n  if (handlerState !== HandlerState.FINALIZED) {\n    throw new Error('Layout Shifts Handler is not finalized');\n  }\n\n  return {\n    clusters: [...clusters],\n    sessionMaxScore: sessionMaxScore,\n    clsWindowID,\n    prePaintEvents: [...prePaintEvents],\n    layoutInvalidationEvents: [...layoutInvalidationEvents],\n    scheduleStyleInvalidationEvents: [...scheduleStyleInvalidationEvents],\n    styleRecalcInvalidationEvents: [],\n    scoreRecords: [...scoreRecords],\n    backendNodeIds: [...backendNodeIds],\n  };\n}\n\nexport function deps(): TraceEventHandlerName[] {\n  return ['Screenshots', 'Meta'];\n}\n\nexport function stateForLayoutShiftScore(score: number): ScoreClassification {\n  let state = ScoreClassification.GOOD;\n  if (score >= LayoutShiftsThreshold.NEEDS_IMPROVEMENT) {\n    state = ScoreClassification.OK;\n  }\n\n  if (score >= LayoutShiftsThreshold.BAD) {\n    state = ScoreClassification.BAD;\n  }\n\n  return state;\n}\n\nexport interface LayoutShiftCluster {\n  clusterWindow: Types.Timing.TraceWindowMicroSeconds;\n  clusterCumulativeScore: number;\n  events: Types.TraceEvents.SyntheticLayoutShift[];\n  // For convenience we split apart the cluster into good, NI, and bad windows.\n  // Since a cluster may remain in the good window, we mark NI and bad as being\n  // possibly null.\n  scoreWindows: {\n    good: Types.Timing.TraceWindowMicroSeconds,\n    needsImprovement: Types.Timing.TraceWindowMicroSeconds|null,\n    bad: Types.Timing.TraceWindowMicroSeconds|null,\n  };\n}\n\n// Based on https://web.dev/cls/\nexport const enum LayoutShiftsThreshold {\n  GOOD = 0,\n  NEEDS_IMPROVEMENT = 0.1,\n  BAD = 0.25,\n}\n"]}

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

@@ -0,0 +1,7 @@
+import * as Types from '../types/types.js';
+export interface MemoryData {
+    updateCountersByProcess: Map<Types.TraceEvents.ProcessID, Types.TraceEvents.TraceEventUpdateCounters[]>;
+}
+export declare function reset(): void;
+export declare function handleEvent(event: Types.TraceEvents.TraceEventData): void;
+export declare function data(): MemoryData;

package/models/trace/handlers/MemoryHandler.js

@@ -1,17 +1,20 @@
-import * as Platform from "../../../core/platform/platform.js";
-import * as Types from "../types/types.js";
-const updateCountersByProcess = /* @__PURE__ */ new Map();
+// 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 Platform from '../../../core/platform/platform.js';
+import * as Types from '../types/types.js';
+const updateCountersByProcess = new Map();
 export function reset() {
-  updateCountersByProcess.clear();
+    updateCountersByProcess.clear();
 }
 export function handleEvent(event) {
-  if (Types.TraceEvents.isTraceEventUpdateCounters(event)) {
-    const countersForProcess = Platform.MapUtilities.getWithDefault(updateCountersByProcess, event.pid, () => []);
-    countersForProcess.push(event);
-    updateCountersByProcess.set(event.pid, countersForProcess);
-  }
+    if (Types.TraceEvents.isTraceEventUpdateCounters(event)) {
+        const countersForProcess = Platform.MapUtilities.getWithDefault(updateCountersByProcess, event.pid, () => []);
+        countersForProcess.push(event);
+        updateCountersByProcess.set(event.pid, countersForProcess);
+    }
 }
 export function data() {
-  return { updateCountersByProcess: new Map(updateCountersByProcess) };
+    return { updateCountersByProcess: new Map(updateCountersByProcess) };
 }
-//# sourceMappingURL=MemoryHandler.js.map
+//# sourceMappingURL=MemoryHandler.js.map

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

@@ -1,7 +1 @@
-{
-  "version": 3,
-  "sources": ["../../../../../../../front_end/models/trace/handlers/MemoryHandler.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 Platform from '../../../core/platform/platform.js';\nimport * as Types from '../types/types.js';\n\nexport interface MemoryData {\n  updateCountersByProcess: Map<Types.TraceEvents.ProcessID, Types.TraceEvents.TraceEventUpdateCounters[]>;\n}\n\nconst updateCountersByProcess: MemoryData['updateCountersByProcess'] = new Map();\n\nexport function reset(): void {\n  updateCountersByProcess.clear();\n}\n\nexport function handleEvent(event: Types.TraceEvents.TraceEventData): void {\n  if (Types.TraceEvents.isTraceEventUpdateCounters(event)) {\n    const countersForProcess = Platform.MapUtilities.getWithDefault(updateCountersByProcess, event.pid, () => []);\n    countersForProcess.push(event);\n    updateCountersByProcess.set(event.pid, countersForProcess);\n  }\n}\n\nexport function data(): MemoryData {\n  return {updateCountersByProcess: new Map(updateCountersByProcess)};\n}\n"],
-  "mappings": "AAIA;AACA;AAMA,MAAM,0BAAiE,oBAAI;AAEpE,wBAAuB;AAC5B,0BAAwB;AAAA;AAGnB,4BAAqB,OAA+C;AACzE,MAAI,MAAM,YAAY,2BAA2B,QAAQ;AACvD,UAAM,qBAAqB,SAAS,aAAa,eAAe,yBAAyB,MAAM,KAAK,MAAM;AAC1G,uBAAmB,KAAK;AACxB,4BAAwB,IAAI,MAAM,KAAK;AAAA;AAAA;AAIpC,uBAA4B;AACjC,SAAO,EAAC,yBAAyB,IAAI,IAAI;AAAA;",
-  "names": []
-}
+{"version":3,"file":"MemoryHandler.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/handlers/MemoryHandler.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,QAAQ,MAAM,oCAAoC,CAAC;AAC/D,OAAO,KAAK,KAAK,MAAM,mBAAmB,CAAC;AAM3C,MAAM,uBAAuB,GAA0C,IAAI,GAAG,EAAE,CAAC;AAEjF,MAAM,UAAU,KAAK;IACnB,uBAAuB,CAAC,KAAK,EAAE,CAAC;AAClC,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,KAAuC;IACjE,IAAI,KAAK,CAAC,WAAW,CAAC,0BAA0B,CAAC,KAAK,CAAC,EAAE;QACvD,MAAM,kBAAkB,GAAG,QAAQ,CAAC,YAAY,CAAC,cAAc,CAAC,uBAAuB,EAAE,KAAK,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC;QAC9G,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC/B,uBAAuB,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,EAAE,kBAAkB,CAAC,CAAC;KAC5D;AACH,CAAC;AAED,MAAM,UAAU,IAAI;IAClB,OAAO,EAAC,uBAAuB,EAAE,IAAI,GAAG,CAAC,uBAAuB,CAAC,EAAC,CAAC;AACrE,CAAC","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 Platform from '../../../core/platform/platform.js';\nimport * as Types from '../types/types.js';\n\nexport interface MemoryData {\n  updateCountersByProcess: Map<Types.TraceEvents.ProcessID, Types.TraceEvents.TraceEventUpdateCounters[]>;\n}\n\nconst updateCountersByProcess: MemoryData['updateCountersByProcess'] = new Map();\n\nexport function reset(): void {\n  updateCountersByProcess.clear();\n}\n\nexport function handleEvent(event: Types.TraceEvents.TraceEventData): void {\n  if (Types.TraceEvents.isTraceEventUpdateCounters(event)) {\n    const countersForProcess = Platform.MapUtilities.getWithDefault(updateCountersByProcess, event.pid, () => []);\n    countersForProcess.push(event);\n    updateCountersByProcess.set(event.pid, countersForProcess);\n  }\n}\n\nexport function data(): MemoryData {\n  return {updateCountersByProcess: new Map(updateCountersByProcess)};\n}\n"]}

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

@@ -0,0 +1,37 @@
+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>;
+export type MetaHandlerData = {
+    traceIsGeneric: boolean;
+    traceBounds: Types.Timing.TraceWindowMicroSeconds;
+    browserProcessId: Types.TraceEvents.ProcessID;
+    processNames: Map<Types.TraceEvents.ProcessID, Types.TraceEvents.TraceEventProcessName>;
+    browserThreadId: Types.TraceEvents.ThreadID;
+    gpuProcessId: Types.TraceEvents.ProcessID;
+    gpuThreadId?: Types.TraceEvents.ThreadID;
+    viewportRect?: DOMRect;
+    navigationsByFrameId: Map<string, Types.TraceEvents.TraceEventNavigationStart[]>;
+    navigationsByNavigationId: Map<string, Types.TraceEvents.TraceEventNavigationStart>;
+    threadsInProcess: Map<Types.TraceEvents.ProcessID, Map<Types.TraceEvents.ThreadID, Types.TraceEvents.TraceEventThreadName>>;
+    mainFrameId: string;
+    mainFrameURL: string;
+    /**
+     * A frame can have multiple renderer processes, at the same time,
+     * a renderer process can have multiple URLs. This map tracks the
+     * processes active on a given frame, with the time window in which
+     * they were active. Because a renderer process might have multiple
+     * URLs, each process in each frame has an array of windows, with an
+     * entry for each URL it had.
+     */
+    rendererProcessesByFrame: FrameProcessData;
+    topLevelRendererIds: Set<Types.TraceEvents.ProcessID>;
+    frameByProcessId: Map<Types.TraceEvents.ProcessID, Map<string, Types.TraceEvents.TraceFrame>>;
+    mainFrameNavigations: Types.TraceEvents.TraceEventNavigationStart[];
+};
+export type FrameProcessData = Map<string, Map<Types.TraceEvents.ProcessID, {
+    frame: Types.TraceEvents.TraceFrame;
+    window: Types.Timing.TraceWindowMicroSeconds;
+}[]>>;
+export declare function data(): MetaHandlerData;