@paulirish/trace_engine 0.0.38 → 0.0.40

package/models/trace/insights/LCPPhases.js

@@ -36,10 +36,10 @@ function breakdownPhases(nav, docRequest, lcpMs, lcpRequest) {
     if (!docReqTiming) {
         throw new Error('no timing for document request');
     }
-    const firstDocByteTs = Helpers.Timing.secondsToMicroseconds(docReqTiming.requestTime) +
-        Helpers.Timing.millisecondsToMicroseconds(docReqTiming.receiveHeadersStart);
+    const firstDocByteTs = Helpers.Timing.secondsToMicro(docReqTiming.requestTime) +
+        Helpers.Timing.milliToMicro(docReqTiming.receiveHeadersStart);
     const firstDocByteTiming = Types.Timing.MicroSeconds(firstDocByteTs - nav.ts);
-    const ttfb = Helpers.Timing.microSecondsToMilliseconds(firstDocByteTiming);
+    const ttfb = Helpers.Timing.microToMilli(firstDocByteTiming);
     let renderDelay = Types.Timing.MilliSeconds(lcpMs - ttfb);
     if (!lcpRequest) {
         if (anyValuesNaN(ttfb, renderDelay)) {
@@ -48,9 +48,9 @@ function breakdownPhases(nav, docRequest, lcpMs, lcpRequest) {
         return { ttfb, renderDelay };
     }
     const lcpStartTs = Types.Timing.MicroSeconds(lcpRequest.ts - nav.ts);
-    const requestStart = Helpers.Timing.microSecondsToMilliseconds(lcpStartTs);
+    const requestStart = Helpers.Timing.microToMilli(lcpStartTs);
     const lcpReqEndTs = Types.Timing.MicroSeconds(lcpRequest.args.data.syntheticData.finishTime - nav.ts);
-    const requestEnd = Helpers.Timing.microSecondsToMilliseconds(lcpReqEndTs);
+    const requestEnd = Helpers.Timing.microToMilli(lcpReqEndTs);
     const loadDelay = Types.Timing.MilliSeconds(requestStart - ttfb);
     const loadTime = Types.Timing.MilliSeconds(requestEnd - requestStart);
     renderDelay = Types.Timing.MilliSeconds(lcpMs - requestEnd);
@@ -101,9 +101,9 @@ export function generateInsight(parsedTrace, context) {
         return finalize({ warnings: [InsightWarning.NO_LCP] });
     }
     // This helps calculate the phases.
-    const lcpMs = Helpers.Timing.microSecondsToMilliseconds(metricScore.timing);
+    const lcpMs = Helpers.Timing.microToMilli(metricScore.timing);
     // This helps position things on the timeline's UI accurately for a trace.
-    const lcpTs = metricScore.event?.ts ? Helpers.Timing.microSecondsToMilliseconds(metricScore.event?.ts) : undefined;
+    const lcpTs = metricScore.event?.ts ? Helpers.Timing.microToMilli(metricScore.event?.ts) : undefined;
     const lcpRequest = parsedTrace.LargestImagePaint.lcpRequestByNavigation.get(context.navigation);
     const docRequest = networkRequests.byTime.find(req => req.args.data.requestId === context.navigationId);
     if (!docRequest) {

package/models/trace/insights/LCPPhases.js.map

@@ -1 +1 @@
-{"version":3,"file":"LCPPhases.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/LCPPhases.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,IAAI,MAAM,4BAA4B,CAAC;AACnD,OAAO,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACpD,OAAO,KAAK,OAAO,MAAM,uBAAuB,CAAC;AACjD,OAAO,KAAK,KAAK,MAAM,mBAAmB,CAAC;AAE3C,OAAO,EACL,eAAe,EAGf,cAAc,GAEf,MAAM,YAAY,CAAC;AAEpB,MAAM,SAAS,GAAG;IAChB;;OAEG;IACH,KAAK,EAAE,cAAc;IACrB;;;OAGG;IACH,WAAW,EACP,mMAAmM;CACxM,CAAC;AACF,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,oCAAoC,EAAE,SAAS,CAAC,CAAC;AAC1F,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;AAEtE,MAAM,UAAU,IAAI;IAClB,OAAO,CAAC,iBAAiB,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,CAAC,CAAC;AAC7E,CAAC;AAiCD,SAAS,YAAY,CAAC,GAAG,MAAgB;IACvC,OAAO,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AAC3C,CAAC;AACD;;;;;GAKG;AACH,SAAS,eAAe,CACpB,GAAiC,EAAE,UAAgD,EACnF,KAAgC,EAAE,UAA0D;IAC9F,MAAM,YAAY,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC;IACjD,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,MAAM,IAAI,KAAK,CAAC,gCAAgC,CAAC,CAAC;IACpD,CAAC;IACD,MAAM,cAAc,GAAG,OAAO,CAAC,MAAM,CAAC,qBAAqB,CAAC,YAAY,CAAC,WAAW,CAAC;QACjF,OAAO,CAAC,MAAM,CAAC,0BAA0B,CAAC,YAAY,CAAC,mBAAmB,CAAC,CAAC;IAEhF,MAAM,kBAAkB,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,cAAc,GAAG,GAAG,CAAC,EAAE,CAAC,CAAC;IAC9E,MAAM,IAAI,GAAG,OAAO,CAAC,MAAM,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,CAAC;IAC3E,IAAI,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC;IAE1D,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,IAAI,YAAY,CAAC,IAAI,EAAE,WAAW,CAAC,EAAE,CAAC;YACpC,OAAO,IAAI,CAAC;QACd,CAAC;QACD,OAAO,EAAC,IAAI,EAAE,WAAW,EAAC,CAAC;IAC7B,CAAC;IAED,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,UAAU,CAAC,EAAE,GAAG,GAAG,CAAC,EAAE,CAAC,CAAC;IACrE,MAAM,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC,0BAA0B,CAAC,UAAU,CAAC,CAAC;IAE3E,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,UAAU,GAAG,GAAG,CAAC,EAAE,CAAC,CAAC;IACtG,MAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,0BAA0B,CAAC,WAAW,CAAC,CAAC;IAE1E,MAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,YAAY,GAAG,IAAI,CAAC,CAAC;IACjE,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,UAAU,GAAG,YAAY,CAAC,CAAC;IACtE,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,KAAK,GAAG,UAAU,CAAC,CAAC;IAC5D,IAAI,YAAY,CAAC,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,CAAC,EAAE,CAAC;QACzD,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO;QACL,IAAI;QACJ,SAAS;QACT,QAAQ;QACR,WAAW;KACZ,CAAC;AACJ,CAAC;AAED,SAAS,QAAQ,CAAC,YAAwF;IAExG,MAAM,aAAa,GAAG,EAAE,CAAC;IACzB,IAAI,YAAY,CAAC,QAAQ,EAAE,CAAC;QAC1B,aAAa,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;IAC5C,CAAC;IACD,IAAI,YAAY,CAAC,UAAU,EAAE,CAAC;QAC5B,aAAa,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;IAC9C,CAAC;IACD,OAAO;QACL,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,KAAK,CAAC;QAClC,WAAW,EAAE,UAAU,CAAC,SAAS,CAAC,WAAW,CAAC;QAC9C,QAAQ,EAAE,eAAe,CAAC,GAAG;QAC7B,6DAA6D;QAC7D,UAAU,EAAE,OAAO,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC,CAAC,GAAG,CAAC;QACzE,GAAG,YAAY;QACf,aAAa;KACd,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,eAAe,CAC3B,WAAsC,EAAE,OAA0B;IACpE,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QACxB,OAAO,QAAQ,CAAC,EAAE,CAAC,CAAC;IACtB,CAAC;IAED,MAAM,eAAe,GAAG,WAAW,CAAC,eAAe,CAAC;IAEpD,MAAM,YAAY,GAAG,WAAW,CAAC,eAAe,CAAC,qBAAqB,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;IAC5F,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,MAAM,IAAI,KAAK,CAAC,kBAAkB,CAAC,CAAC;IACtC,CAAC;IAED,MAAM,UAAU,GAAG,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;IAC1D,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,MAAM,IAAI,KAAK,CAAC,uBAAuB,CAAC,CAAC;IAC3C,CAAC;IACD,MAAM,WAAW,GAAG,UAAU,CAAC,GAAG,mEAAuD,CAAC;IAC1F,MAAM,QAAQ,GAAG,WAAW,EAAE,KAAK,CAAC;IACpC,IAAI,CAAC,QAAQ,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,iCAAiC,CAAC,QAAQ,CAAC,EAAE,CAAC;QAC3E,OAAO,QAAQ,CAAC,EAAC,QAAQ,EAAE,CAAC,cAAc,CAAC,MAAM,CAAC,EAAC,CAAC,CAAC;IACvD,CAAC;IAED,mCAAmC;IACnC,MAAM,KAAK,GAAG,OAAO,CAAC,MAAM,CAAC,0BAA0B,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5E,0EAA0E;IAC1E,MAAM,KAAK,GAAG,WAAW,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,0BAA0B,CAAC,WAAW,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IACnH,MAAM,UAAU,GAAG,WAAW,CAAC,iBAAiB,CAAC,sBAAsB,CAAC,GAAG,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAEhG,MAAM,UAAU,GAAG,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,KAAK,OAAO,CAAC,YAAY,CAAC,CAAC;IACxG,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,OAAO,QAAQ,CAAC,EAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC,cAAc,CAAC,mBAAmB,CAAC,EAAC,CAAC,CAAC;IACxG,CAAC;IAED,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,OAAO,QAAQ,CAAC;YACd,KAAK;YACL,KAAK;YACL,QAAQ;YACR,UAAU;YACV,MAAM,EAAE,eAAe,CAAC,OAAO,CAAC,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,CAAC,IAAI,SAAS;SACxF,CAAC,CAAC;IACL,CAAC;IAED,OAAO,QAAQ,CAAC;QACd,KAAK;QACL,KAAK;QACL,QAAQ;QACR,UAAU;QACV,MAAM,EAAE,eAAe,CAAC,OAAO,CAAC,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,CAAC,IAAI,SAAS;KACxF,CAAC,CAAC;AACL,CAAC","sourcesContent":["// Copyright 2024 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 i18n from '../../../core/i18n/i18n.js';\nimport * as Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport * as Types from '../types/types.js';\n\nimport {\n  InsightCategory,\n  type InsightModel,\n  type InsightSetContext,\n  InsightWarning,\n  type RequiredData,\n} from './types.js';\n\nconst UIStrings = {\n  /**\n   *@description Title of an insight that provides details about the LCP metric, broken down by phases / parts.\n   */\n  title: 'LCP by phase',\n  /**\n   * @description Description of a DevTools insight that presents a breakdown for the LCP metric by phases.\n   * This is displayed after a user expands the section to see more. No character length limits.\n   */\n  description:\n      'Each [phase has specific improvement strategies](https://web.dev/articles/optimize-lcp#lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays.',\n};\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/LCPPhases.ts', UIStrings);\nconst i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport function deps(): ['NetworkRequests', 'PageLoadMetrics', 'LargestImagePaint', 'Meta'] {\n  return ['NetworkRequests', 'PageLoadMetrics', 'LargestImagePaint', 'Meta'];\n}\n\ninterface LCPPhases {\n  /**\n   * The time between when the user initiates loading the page until when\n   * the browser receives the first byte of the html response.\n   */\n  ttfb: Types.Timing.MilliSeconds;\n  /**\n   * The time between ttfb and the LCP request request being started.\n   * For a text LCP, this is undefined given no request is loaded.\n   */\n  loadDelay?: Types.Timing.MilliSeconds;\n  /**\n   * The time it takes to load the LCP request.\n   */\n  loadTime?: Types.Timing.MilliSeconds;\n  /**\n   * The time between when the LCP request finishes loading and when\n   * the LCP element is rendered.\n   */\n  renderDelay: Types.Timing.MilliSeconds;\n}\n\nexport type LCPPhasesInsightModel = InsightModel<{\n  lcpMs?: Types.Timing.MilliSeconds,\n  lcpTs?: Types.Timing.MilliSeconds,\n  lcpEvent?: Types.Events.LargestContentfulPaintCandidate,\n  /** The network request for the LCP image, if there was one. */\n  lcpRequest?: Types.Events.SyntheticNetworkRequest,\n  phases?: LCPPhases,\n}>;\n\nfunction anyValuesNaN(...values: number[]): boolean {\n  return values.some(v => Number.isNaN(v));\n}\n/**\n * Calculates the 4 phases of an LCP and the timings of each.\n * Will return `null` if any required values were missing. We don't ever expect\n * them to be missing on newer traces, but old trace files may lack some of the\n * data we rely on, so we want to handle that case.\n */\nfunction breakdownPhases(\n    nav: Types.Events.NavigationStart, docRequest: Types.Events.SyntheticNetworkRequest,\n    lcpMs: Types.Timing.MilliSeconds, lcpRequest: Types.Events.SyntheticNetworkRequest|undefined): LCPPhases|null {\n  const docReqTiming = docRequest.args.data.timing;\n  if (!docReqTiming) {\n    throw new Error('no timing for document request');\n  }\n  const firstDocByteTs = Helpers.Timing.secondsToMicroseconds(docReqTiming.requestTime) +\n      Helpers.Timing.millisecondsToMicroseconds(docReqTiming.receiveHeadersStart);\n\n  const firstDocByteTiming = Types.Timing.MicroSeconds(firstDocByteTs - nav.ts);\n  const ttfb = Helpers.Timing.microSecondsToMilliseconds(firstDocByteTiming);\n  let renderDelay = Types.Timing.MilliSeconds(lcpMs - ttfb);\n\n  if (!lcpRequest) {\n    if (anyValuesNaN(ttfb, renderDelay)) {\n      return null;\n    }\n    return {ttfb, renderDelay};\n  }\n\n  const lcpStartTs = Types.Timing.MicroSeconds(lcpRequest.ts - nav.ts);\n  const requestStart = Helpers.Timing.microSecondsToMilliseconds(lcpStartTs);\n\n  const lcpReqEndTs = Types.Timing.MicroSeconds(lcpRequest.args.data.syntheticData.finishTime - nav.ts);\n  const requestEnd = Helpers.Timing.microSecondsToMilliseconds(lcpReqEndTs);\n\n  const loadDelay = Types.Timing.MilliSeconds(requestStart - ttfb);\n  const loadTime = Types.Timing.MilliSeconds(requestEnd - requestStart);\n  renderDelay = Types.Timing.MilliSeconds(lcpMs - requestEnd);\n  if (anyValuesNaN(ttfb, loadDelay, loadTime, renderDelay)) {\n    return null;\n  }\n\n  return {\n    ttfb,\n    loadDelay,\n    loadTime,\n    renderDelay,\n  };\n}\n\nfunction finalize(partialModel: Omit<LCPPhasesInsightModel, 'title'|'description'|'category'|'shouldShow'>):\n    LCPPhasesInsightModel {\n  const relatedEvents = [];\n  if (partialModel.lcpEvent) {\n    relatedEvents.push(partialModel.lcpEvent);\n  }\n  if (partialModel.lcpRequest) {\n    relatedEvents.push(partialModel.lcpRequest);\n  }\n  return {\n    title: i18nString(UIStrings.title),\n    description: i18nString(UIStrings.description),\n    category: InsightCategory.LCP,\n    // TODO: should move the component's \"getPhaseData\" to model.\n    shouldShow: Boolean(partialModel.phases) && (partialModel.lcpMs ?? 0) > 0,\n    ...partialModel,\n    relatedEvents,\n  };\n}\n\nexport function generateInsight(\n    parsedTrace: RequiredData<typeof deps>, context: InsightSetContext): LCPPhasesInsightModel {\n  if (!context.navigation) {\n    return finalize({});\n  }\n\n  const networkRequests = parsedTrace.NetworkRequests;\n\n  const frameMetrics = parsedTrace.PageLoadMetrics.metricScoresByFrameId.get(context.frameId);\n  if (!frameMetrics) {\n    throw new Error('no frame metrics');\n  }\n\n  const navMetrics = frameMetrics.get(context.navigationId);\n  if (!navMetrics) {\n    throw new Error('no navigation metrics');\n  }\n  const metricScore = navMetrics.get(Handlers.ModelHandlers.PageLoadMetrics.MetricName.LCP);\n  const lcpEvent = metricScore?.event;\n  if (!lcpEvent || !Types.Events.isLargestContentfulPaintCandidate(lcpEvent)) {\n    return finalize({warnings: [InsightWarning.NO_LCP]});\n  }\n\n  // This helps calculate the phases.\n  const lcpMs = Helpers.Timing.microSecondsToMilliseconds(metricScore.timing);\n  // This helps position things on the timeline's UI accurately for a trace.\n  const lcpTs = metricScore.event?.ts ? Helpers.Timing.microSecondsToMilliseconds(metricScore.event?.ts) : undefined;\n  const lcpRequest = parsedTrace.LargestImagePaint.lcpRequestByNavigation.get(context.navigation);\n\n  const docRequest = networkRequests.byTime.find(req => req.args.data.requestId === context.navigationId);\n  if (!docRequest) {\n    return finalize({lcpMs, lcpTs, lcpEvent, lcpRequest, warnings: [InsightWarning.NO_DOCUMENT_REQUEST]});\n  }\n\n  if (!lcpRequest) {\n    return finalize({\n      lcpMs,\n      lcpTs,\n      lcpEvent,\n      lcpRequest,\n      phases: breakdownPhases(context.navigation, docRequest, lcpMs, lcpRequest) ?? undefined,\n    });\n  }\n\n  return finalize({\n    lcpMs,\n    lcpTs,\n    lcpEvent,\n    lcpRequest,\n    phases: breakdownPhases(context.navigation, docRequest, lcpMs, lcpRequest) ?? undefined,\n  });\n}\n"]}
+{"version":3,"file":"LCPPhases.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/LCPPhases.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,IAAI,MAAM,4BAA4B,CAAC;AACnD,OAAO,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACpD,OAAO,KAAK,OAAO,MAAM,uBAAuB,CAAC;AACjD,OAAO,KAAK,KAAK,MAAM,mBAAmB,CAAC;AAE3C,OAAO,EACL,eAAe,EAGf,cAAc,GAEf,MAAM,YAAY,CAAC;AAEpB,MAAM,SAAS,GAAG;IAChB;;OAEG;IACH,KAAK,EAAE,cAAc;IACrB;;;OAGG;IACH,WAAW,EACP,mMAAmM;CACxM,CAAC;AACF,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,oCAAoC,EAAE,SAAS,CAAC,CAAC;AAC1F,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;AAEtE,MAAM,UAAU,IAAI;IAClB,OAAO,CAAC,iBAAiB,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,CAAC,CAAC;AAC7E,CAAC;AAiCD,SAAS,YAAY,CAAC,GAAG,MAAgB;IACvC,OAAO,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AAC3C,CAAC;AACD;;;;;GAKG;AACH,SAAS,eAAe,CACpB,GAAiC,EAAE,UAAgD,EACnF,KAAgC,EAAE,UAA0D;IAC9F,MAAM,YAAY,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC;IACjD,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,MAAM,IAAI,KAAK,CAAC,gCAAgC,CAAC,CAAC;IACpD,CAAC;IACD,MAAM,cAAc,GAAG,OAAO,CAAC,MAAM,CAAC,cAAc,CAAC,YAAY,CAAC,WAAW,CAAC;QAC1E,OAAO,CAAC,MAAM,CAAC,YAAY,CAAC,YAAY,CAAC,mBAAmB,CAAC,CAAC;IAElE,MAAM,kBAAkB,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,cAAc,GAAG,GAAG,CAAC,EAAE,CAAC,CAAC;IAC9E,MAAM,IAAI,GAAG,OAAO,CAAC,MAAM,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC;IAC7D,IAAI,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC;IAE1D,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,IAAI,YAAY,CAAC,IAAI,EAAE,WAAW,CAAC,EAAE,CAAC;YACpC,OAAO,IAAI,CAAC;QACd,CAAC;QACD,OAAO,EAAC,IAAI,EAAE,WAAW,EAAC,CAAC;IAC7B,CAAC;IAED,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,UAAU,CAAC,EAAE,GAAG,GAAG,CAAC,EAAE,CAAC,CAAC;IACrE,MAAM,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;IAE7D,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,UAAU,GAAG,GAAG,CAAC,EAAE,CAAC,CAAC;IACtG,MAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC;IAE5D,MAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,YAAY,GAAG,IAAI,CAAC,CAAC;IACjE,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,UAAU,GAAG,YAAY,CAAC,CAAC;IACtE,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,KAAK,GAAG,UAAU,CAAC,CAAC;IAC5D,IAAI,YAAY,CAAC,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,CAAC,EAAE,CAAC;QACzD,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO;QACL,IAAI;QACJ,SAAS;QACT,QAAQ;QACR,WAAW;KACZ,CAAC;AACJ,CAAC;AAED,SAAS,QAAQ,CAAC,YAAwF;IAExG,MAAM,aAAa,GAAG,EAAE,CAAC;IACzB,IAAI,YAAY,CAAC,QAAQ,EAAE,CAAC;QAC1B,aAAa,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;IAC5C,CAAC;IACD,IAAI,YAAY,CAAC,UAAU,EAAE,CAAC;QAC5B,aAAa,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;IAC9C,CAAC;IACD,OAAO;QACL,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,KAAK,CAAC;QAClC,WAAW,EAAE,UAAU,CAAC,SAAS,CAAC,WAAW,CAAC;QAC9C,QAAQ,EAAE,eAAe,CAAC,GAAG;QAC7B,6DAA6D;QAC7D,UAAU,EAAE,OAAO,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC,CAAC,GAAG,CAAC;QACzE,GAAG,YAAY;QACf,aAAa;KACd,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,eAAe,CAC3B,WAAsC,EAAE,OAA0B;IACpE,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QACxB,OAAO,QAAQ,CAAC,EAAE,CAAC,CAAC;IACtB,CAAC;IAED,MAAM,eAAe,GAAG,WAAW,CAAC,eAAe,CAAC;IAEpD,MAAM,YAAY,GAAG,WAAW,CAAC,eAAe,CAAC,qBAAqB,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;IAC5F,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,MAAM,IAAI,KAAK,CAAC,kBAAkB,CAAC,CAAC;IACtC,CAAC;IAED,MAAM,UAAU,GAAG,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;IAC1D,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,MAAM,IAAI,KAAK,CAAC,uBAAuB,CAAC,CAAC;IAC3C,CAAC;IACD,MAAM,WAAW,GAAG,UAAU,CAAC,GAAG,mEAAuD,CAAC;IAC1F,MAAM,QAAQ,GAAG,WAAW,EAAE,KAAK,CAAC;IACpC,IAAI,CAAC,QAAQ,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,iCAAiC,CAAC,QAAQ,CAAC,EAAE,CAAC;QAC3E,OAAO,QAAQ,CAAC,EAAC,QAAQ,EAAE,CAAC,cAAc,CAAC,MAAM,CAAC,EAAC,CAAC,CAAC;IACvD,CAAC;IAED,mCAAmC;IACnC,MAAM,KAAK,GAAG,OAAO,CAAC,MAAM,CAAC,YAAY,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;IAC9D,0EAA0E;IAC1E,MAAM,KAAK,GAAG,WAAW,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,YAAY,CAAC,WAAW,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IACrG,MAAM,UAAU,GAAG,WAAW,CAAC,iBAAiB,CAAC,sBAAsB,CAAC,GAAG,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAEhG,MAAM,UAAU,GAAG,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,KAAK,OAAO,CAAC,YAAY,CAAC,CAAC;IACxG,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,OAAO,QAAQ,CAAC,EAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC,cAAc,CAAC,mBAAmB,CAAC,EAAC,CAAC,CAAC;IACxG,CAAC;IAED,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,OAAO,QAAQ,CAAC;YACd,KAAK;YACL,KAAK;YACL,QAAQ;YACR,UAAU;YACV,MAAM,EAAE,eAAe,CAAC,OAAO,CAAC,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,CAAC,IAAI,SAAS;SACxF,CAAC,CAAC;IACL,CAAC;IAED,OAAO,QAAQ,CAAC;QACd,KAAK;QACL,KAAK;QACL,QAAQ;QACR,UAAU;QACV,MAAM,EAAE,eAAe,CAAC,OAAO,CAAC,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,CAAC,IAAI,SAAS;KACxF,CAAC,CAAC;AACL,CAAC","sourcesContent":["// Copyright 2024 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 i18n from '../../../core/i18n/i18n.js';\nimport * as Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport * as Types from '../types/types.js';\n\nimport {\n  InsightCategory,\n  type InsightModel,\n  type InsightSetContext,\n  InsightWarning,\n  type RequiredData,\n} from './types.js';\n\nconst UIStrings = {\n  /**\n   *@description Title of an insight that provides details about the LCP metric, broken down by phases / parts.\n   */\n  title: 'LCP by phase',\n  /**\n   * @description Description of a DevTools insight that presents a breakdown for the LCP metric by phases.\n   * This is displayed after a user expands the section to see more. No character length limits.\n   */\n  description:\n      'Each [phase has specific improvement strategies](https://web.dev/articles/optimize-lcp#lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays.',\n};\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/LCPPhases.ts', UIStrings);\nconst i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport function deps(): ['NetworkRequests', 'PageLoadMetrics', 'LargestImagePaint', 'Meta'] {\n  return ['NetworkRequests', 'PageLoadMetrics', 'LargestImagePaint', 'Meta'];\n}\n\ninterface LCPPhases {\n  /**\n   * The time between when the user initiates loading the page until when\n   * the browser receives the first byte of the html response.\n   */\n  ttfb: Types.Timing.MilliSeconds;\n  /**\n   * The time between ttfb and the LCP request request being started.\n   * For a text LCP, this is undefined given no request is loaded.\n   */\n  loadDelay?: Types.Timing.MilliSeconds;\n  /**\n   * The time it takes to load the LCP request.\n   */\n  loadTime?: Types.Timing.MilliSeconds;\n  /**\n   * The time between when the LCP request finishes loading and when\n   * the LCP element is rendered.\n   */\n  renderDelay: Types.Timing.MilliSeconds;\n}\n\nexport type LCPPhasesInsightModel = InsightModel<{\n  lcpMs?: Types.Timing.MilliSeconds,\n  lcpTs?: Types.Timing.MilliSeconds,\n  lcpEvent?: Types.Events.LargestContentfulPaintCandidate,\n  /** The network request for the LCP image, if there was one. */\n  lcpRequest?: Types.Events.SyntheticNetworkRequest,\n  phases?: LCPPhases,\n}>;\n\nfunction anyValuesNaN(...values: number[]): boolean {\n  return values.some(v => Number.isNaN(v));\n}\n/**\n * Calculates the 4 phases of an LCP and the timings of each.\n * Will return `null` if any required values were missing. We don't ever expect\n * them to be missing on newer traces, but old trace files may lack some of the\n * data we rely on, so we want to handle that case.\n */\nfunction breakdownPhases(\n    nav: Types.Events.NavigationStart, docRequest: Types.Events.SyntheticNetworkRequest,\n    lcpMs: Types.Timing.MilliSeconds, lcpRequest: Types.Events.SyntheticNetworkRequest|undefined): LCPPhases|null {\n  const docReqTiming = docRequest.args.data.timing;\n  if (!docReqTiming) {\n    throw new Error('no timing for document request');\n  }\n  const firstDocByteTs = Helpers.Timing.secondsToMicro(docReqTiming.requestTime) +\n      Helpers.Timing.milliToMicro(docReqTiming.receiveHeadersStart);\n\n  const firstDocByteTiming = Types.Timing.MicroSeconds(firstDocByteTs - nav.ts);\n  const ttfb = Helpers.Timing.microToMilli(firstDocByteTiming);\n  let renderDelay = Types.Timing.MilliSeconds(lcpMs - ttfb);\n\n  if (!lcpRequest) {\n    if (anyValuesNaN(ttfb, renderDelay)) {\n      return null;\n    }\n    return {ttfb, renderDelay};\n  }\n\n  const lcpStartTs = Types.Timing.MicroSeconds(lcpRequest.ts - nav.ts);\n  const requestStart = Helpers.Timing.microToMilli(lcpStartTs);\n\n  const lcpReqEndTs = Types.Timing.MicroSeconds(lcpRequest.args.data.syntheticData.finishTime - nav.ts);\n  const requestEnd = Helpers.Timing.microToMilli(lcpReqEndTs);\n\n  const loadDelay = Types.Timing.MilliSeconds(requestStart - ttfb);\n  const loadTime = Types.Timing.MilliSeconds(requestEnd - requestStart);\n  renderDelay = Types.Timing.MilliSeconds(lcpMs - requestEnd);\n  if (anyValuesNaN(ttfb, loadDelay, loadTime, renderDelay)) {\n    return null;\n  }\n\n  return {\n    ttfb,\n    loadDelay,\n    loadTime,\n    renderDelay,\n  };\n}\n\nfunction finalize(partialModel: Omit<LCPPhasesInsightModel, 'title'|'description'|'category'|'shouldShow'>):\n    LCPPhasesInsightModel {\n  const relatedEvents = [];\n  if (partialModel.lcpEvent) {\n    relatedEvents.push(partialModel.lcpEvent);\n  }\n  if (partialModel.lcpRequest) {\n    relatedEvents.push(partialModel.lcpRequest);\n  }\n  return {\n    title: i18nString(UIStrings.title),\n    description: i18nString(UIStrings.description),\n    category: InsightCategory.LCP,\n    // TODO: should move the component's \"getPhaseData\" to model.\n    shouldShow: Boolean(partialModel.phases) && (partialModel.lcpMs ?? 0) > 0,\n    ...partialModel,\n    relatedEvents,\n  };\n}\n\nexport function generateInsight(\n    parsedTrace: RequiredData<typeof deps>, context: InsightSetContext): LCPPhasesInsightModel {\n  if (!context.navigation) {\n    return finalize({});\n  }\n\n  const networkRequests = parsedTrace.NetworkRequests;\n\n  const frameMetrics = parsedTrace.PageLoadMetrics.metricScoresByFrameId.get(context.frameId);\n  if (!frameMetrics) {\n    throw new Error('no frame metrics');\n  }\n\n  const navMetrics = frameMetrics.get(context.navigationId);\n  if (!navMetrics) {\n    throw new Error('no navigation metrics');\n  }\n  const metricScore = navMetrics.get(Handlers.ModelHandlers.PageLoadMetrics.MetricName.LCP);\n  const lcpEvent = metricScore?.event;\n  if (!lcpEvent || !Types.Events.isLargestContentfulPaintCandidate(lcpEvent)) {\n    return finalize({warnings: [InsightWarning.NO_LCP]});\n  }\n\n  // This helps calculate the phases.\n  const lcpMs = Helpers.Timing.microToMilli(metricScore.timing);\n  // This helps position things on the timeline's UI accurately for a trace.\n  const lcpTs = metricScore.event?.ts ? Helpers.Timing.microToMilli(metricScore.event?.ts) : undefined;\n  const lcpRequest = parsedTrace.LargestImagePaint.lcpRequestByNavigation.get(context.navigation);\n\n  const docRequest = networkRequests.byTime.find(req => req.args.data.requestId === context.navigationId);\n  if (!docRequest) {\n    return finalize({lcpMs, lcpTs, lcpEvent, lcpRequest, warnings: [InsightWarning.NO_DOCUMENT_REQUEST]});\n  }\n\n  if (!lcpRequest) {\n    return finalize({\n      lcpMs,\n      lcpTs,\n      lcpEvent,\n      lcpRequest,\n      phases: breakdownPhases(context.navigation, docRequest, lcpMs, lcpRequest) ?? undefined,\n    });\n  }\n\n  return finalize({\n    lcpMs,\n    lcpTs,\n    lcpEvent,\n    lcpRequest,\n    phases: breakdownPhases(context.navigation, docRequest, lcpMs, lcpRequest) ?? undefined,\n  });\n}\n"]}

package/models/trace/insights/Models.d.ts

@@ -1,5 +1,6 @@
 export * as CLSCulprits from './CLSCulprits.js';
 export * as DocumentLatency from './DocumentLatency.js';
+export * as DOMSize from './DOMSize.js';
 export * as FontDisplay from './FontDisplay.js';
 export * as ImageDelivery from './ImageDelivery.js';
 export * as InteractionToNextPaint from './InteractionToNextPaint.js';

package/models/trace/insights/Models.js

@@ -3,6 +3,7 @@
 // found in the LICENSE file.
 export * as CLSCulprits from './CLSCulprits.js';
 export * as DocumentLatency from './DocumentLatency.js';
+export * as DOMSize from './DOMSize.js';
 export * as FontDisplay from './FontDisplay.js';
 export * as ImageDelivery from './ImageDelivery.js';
 export * as InteractionToNextPaint from './InteractionToNextPaint.js';

package/models/trace/insights/Models.js.map

@@ -1 +1 @@
-{"version":3,"file":"Models.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/Models.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,WAAW,MAAM,kBAAkB,CAAC;AAChD,OAAO,KAAK,eAAe,MAAM,sBAAsB,CAAC;AACxD,OAAO,KAAK,WAAW,MAAM,kBAAkB,CAAC;AAChD,OAAO,KAAK,aAAa,MAAM,oBAAoB,CAAC;AACpD,OAAO,KAAK,sBAAsB,MAAM,6BAA6B,CAAC;AACtE,OAAO,KAAK,YAAY,MAAM,mBAAmB,CAAC;AAClD,OAAO,KAAK,SAAS,MAAM,gBAAgB,CAAC;AAC5C,OAAO,KAAK,cAAc,MAAM,qBAAqB,CAAC;AACtD,OAAO,KAAK,eAAe,MAAM,sBAAsB,CAAC;AACxD,OAAO,KAAK,YAAY,MAAM,mBAAmB,CAAC;AAClD,OAAO,KAAK,QAAQ,MAAM,eAAe,CAAC","sourcesContent":["// Copyright 2024 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\nexport * as CLSCulprits from './CLSCulprits.js';\nexport * as DocumentLatency from './DocumentLatency.js';\nexport * as FontDisplay from './FontDisplay.js';\nexport * as ImageDelivery from './ImageDelivery.js';\nexport * as InteractionToNextPaint from './InteractionToNextPaint.js';\nexport * as LCPDiscovery from './LCPDiscovery.js';\nexport * as LCPPhases from './LCPPhases.js';\nexport * as RenderBlocking from './RenderBlocking.js';\nexport * as SlowCSSSelector from './SlowCSSSelector.js';\nexport * as ThirdParties from './ThirdParties.js';\nexport * as Viewport from './Viewport.js';\n"]}
+{"version":3,"file":"Models.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/Models.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,WAAW,MAAM,kBAAkB,CAAC;AAChD,OAAO,KAAK,eAAe,MAAM,sBAAsB,CAAC;AACxD,OAAO,KAAK,OAAO,MAAM,cAAc,CAAC;AACxC,OAAO,KAAK,WAAW,MAAM,kBAAkB,CAAC;AAChD,OAAO,KAAK,aAAa,MAAM,oBAAoB,CAAC;AACpD,OAAO,KAAK,sBAAsB,MAAM,6BAA6B,CAAC;AACtE,OAAO,KAAK,YAAY,MAAM,mBAAmB,CAAC;AAClD,OAAO,KAAK,SAAS,MAAM,gBAAgB,CAAC;AAC5C,OAAO,KAAK,cAAc,MAAM,qBAAqB,CAAC;AACtD,OAAO,KAAK,eAAe,MAAM,sBAAsB,CAAC;AACxD,OAAO,KAAK,YAAY,MAAM,mBAAmB,CAAC;AAClD,OAAO,KAAK,QAAQ,MAAM,eAAe,CAAC","sourcesContent":["// Copyright 2024 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\nexport * as CLSCulprits from './CLSCulprits.js';\nexport * as DocumentLatency from './DocumentLatency.js';\nexport * as DOMSize from './DOMSize.js';\nexport * as FontDisplay from './FontDisplay.js';\nexport * as ImageDelivery from './ImageDelivery.js';\nexport * as InteractionToNextPaint from './InteractionToNextPaint.js';\nexport * as LCPDiscovery from './LCPDiscovery.js';\nexport * as LCPPhases from './LCPPhases.js';\nexport * as RenderBlocking from './RenderBlocking.js';\nexport * as SlowCSSSelector from './SlowCSSSelector.js';\nexport * as ThirdParties from './ThirdParties.js';\nexport * as Viewport from './Viewport.js';\n"]}

package/models/trace/insights/Statistics.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Returns the score (1 - percentile) of `value` in a log-normal distribution
+ * specified by the `median` value, at which the score will be 0.5, and a 10th
+ * percentile value, at which the score will be 0.9. The score represents the
+ * amount of the distribution greater than `value`. All values should be in the
+ * same units (e.g. milliseconds). See
+ *   https://www.desmos.com/calculator/o98tbeyt1t
+ * for an interactive view of the relationship between these parameters and the
+ * typical parameterization (location and shape) of the log-normal distribution.
+ */
+export declare function getLogNormalScore({ median, p10 }: {
+    median: number;
+    p10: number;
+}, value: number): number;

package/models/trace/insights/Statistics.js

@@ -0,0 +1,86 @@
+// Copyright 2024 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.
+// Lifted from Lighthouse: https://github.com/GoogleChrome/lighthouse/blob/36cac182a6c637b1671c57326d7c0241633d0076/shared/statistics.js
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// The exact double values for the max and min scores possible in each range.
+const MIN_PASSING_SCORE = 0.90000000000000002220446049250313080847263336181640625;
+const MAX_AVERAGE_SCORE = 0.899999999999999911182158029987476766109466552734375;
+const MIN_AVERAGE_SCORE = 0.5;
+const MAX_FAILING_SCORE = 0.499999999999999944488848768742172978818416595458984375;
+/**
+ * Approximates the Gauss error function, the probability that a random variable
+ * from the standard normal distribution lies within [-x, x]. Moved from
+ * traceviewer.b.math.erf, based on Abramowitz and Stegun, formula 7.1.26.
+ */
+function erf(x) {
+    // erf(-x) = -erf(x);
+    const sign = Math.sign(x);
+    x = Math.abs(x);
+    const a1 = 0.254829592;
+    const a2 = -0.284496736;
+    const a3 = 1.421413741;
+    const a4 = -1.453152027;
+    const a5 = 1.061405429;
+    const p = 0.3275911;
+    const t = 1 / (1 + p * x);
+    const y = t * (a1 + t * (a2 + t * (a3 + t * (a4 + t * a5))));
+    return sign * (1 - y * Math.exp(-x * x));
+}
+/**
+ * Returns the score (1 - percentile) of `value` in a log-normal distribution
+ * specified by the `median` value, at which the score will be 0.5, and a 10th
+ * percentile value, at which the score will be 0.9. The score represents the
+ * amount of the distribution greater than `value`. All values should be in the
+ * same units (e.g. milliseconds). See
+ *   https://www.desmos.com/calculator/o98tbeyt1t
+ * for an interactive view of the relationship between these parameters and the
+ * typical parameterization (location and shape) of the log-normal distribution.
+ */
+export function getLogNormalScore({ median, p10 }, value) {
+    // Required for the log-normal distribution.
+    if (median <= 0) {
+        throw new Error('median must be greater than zero');
+    }
+    if (p10 <= 0) {
+        throw new Error('p10 must be greater than zero');
+    }
+    // Not strictly required, but if p10 > median, it flips around and becomes the p90 point.
+    if (p10 >= median) {
+        throw new Error('p10 must be less than the median');
+    }
+    // Non-positive values aren't in the distribution, so always 1.
+    if (value <= 0) {
+        return 1;
+    }
+    // Closest double to `erfc-1(1/5)`.
+    const INVERSE_ERFC_ONE_FIFTH = 0.9061938024368232;
+    // Shape (σ) is `|log(p10/median) / (sqrt(2)*erfc^-1(1/5))|` and
+    // standardizedX is `1/2 erfc(log(value/median) / (sqrt(2)*σ))`, so simplify a bit.
+    const xRatio = Math.max(Number.MIN_VALUE, value / median); // value and median are > 0, so is ratio.
+    const xLogRatio = Math.log(xRatio);
+    const p10Ratio = Math.max(Number.MIN_VALUE, p10 / median); // p10 and median are > 0, so is ratio.
+    const p10LogRatio = -Math.log(p10Ratio); // negate to keep σ positive.
+    const standardizedX = xLogRatio * INVERSE_ERFC_ONE_FIFTH / p10LogRatio;
+    const complementaryPercentile = (1 - erf(standardizedX)) / 2;
+    // Clamp to avoid floating-point out-of-bounds issues and keep score in expected range.
+    let score;
+    if (value <= p10) {
+        // Passing. Clamp to [0.9, 1].
+        score = Math.max(MIN_PASSING_SCORE, Math.min(1, complementaryPercentile));
+    }
+    else if (value <= median) {
+        // Average. Clamp to [0.5, 0.9).
+        score = Math.max(MIN_AVERAGE_SCORE, Math.min(MAX_AVERAGE_SCORE, complementaryPercentile));
+    }
+    else {
+        // Failing. Clamp to [0, 0.5).
+        score = Math.max(0, Math.min(MAX_FAILING_SCORE, complementaryPercentile));
+    }
+    return score;
+}
+//# sourceMappingURL=Statistics.js.map

package/models/trace/insights/Statistics.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Statistics.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/Statistics.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,wIAAwI;AAExI;;;;GAIG;AAEH,6EAA6E;AAC7E,MAAM,iBAAiB,GAAG,uDAAuD,CAAC;AAClF,MAAM,iBAAiB,GAAG,qDAAqD,CAAC;AAChF,MAAM,iBAAiB,GAAG,GAAG,CAAC;AAC9B,MAAM,iBAAiB,GAAG,wDAAwD,CAAC;AAEnF;;;;GAIG;AACH,SAAS,GAAG,CAAC,CAAS;IACpB,qBAAqB;IACrB,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IAC1B,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;IAEhB,MAAM,EAAE,GAAG,WAAW,CAAC;IACvB,MAAM,EAAE,GAAG,CAAC,WAAW,CAAC;IACxB,MAAM,EAAE,GAAG,WAAW,CAAC;IACvB,MAAM,EAAE,GAAG,CAAC,WAAW,CAAC;IACxB,MAAM,EAAE,GAAG,WAAW,CAAC;IACvB,MAAM,CAAC,GAAG,SAAS,CAAC;IACpB,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;IAC1B,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;IAC7D,OAAO,IAAI,GAAG,CAAC,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;AAC3C,CAAC;AAED;;;;;;;;;GASG;AACH,MAAM,UAAU,iBAAiB,CAAC,EAAC,MAAM,EAAE,GAAG,EAAgC,EAAE,KAAa;IAC3F,4CAA4C;IAC5C,IAAI,MAAM,IAAI,CAAC,EAAE,CAAC;QAChB,MAAM,IAAI,KAAK,CAAC,kCAAkC,CAAC,CAAC;IACtD,CAAC;IACD,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC;QACb,MAAM,IAAI,KAAK,CAAC,+BAA+B,CAAC,CAAC;IACnD,CAAC;IACD,yFAAyF;IACzF,IAAI,GAAG,IAAI,MAAM,EAAE,CAAC;QAClB,MAAM,IAAI,KAAK,CAAC,kCAAkC,CAAC,CAAC;IACtD,CAAC;IAED,+DAA+D;IAC/D,IAAI,KAAK,IAAI,CAAC,EAAE,CAAC;QACf,OAAO,CAAC,CAAC;IACX,CAAC;IAED,mCAAmC;IACnC,MAAM,sBAAsB,GAAG,kBAAkB,CAAC;IAElD,gEAAgE;IAChE,mFAAmF;IACnF,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC,CAAC,CAAE,yCAAyC;IACrG,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;IACnC,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,SAAS,EAAE,GAAG,GAAG,MAAM,CAAC,CAAC,CAAE,uCAAuC;IACnG,MAAM,WAAW,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAoB,6BAA6B;IACzF,MAAM,aAAa,GAAG,SAAS,GAAG,sBAAsB,GAAG,WAAW,CAAC;IACvE,MAAM,uBAAuB,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC,aAAa,CAAC,CAAC,GAAG,CAAC,CAAC;IAE7D,uFAAuF;IACvF,IAAI,KAAK,CAAC;IACV,IAAI,KAAK,IAAI,GAAG,EAAE,CAAC;QACjB,8BAA8B;QAC9B,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,uBAAuB,CAAC,CAAC,CAAC;IAC5E,CAAC;SAAM,IAAI,KAAK,IAAI,MAAM,EAAE,CAAC;QAC3B,gCAAgC;QAChC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,EAAE,IAAI,CAAC,GAAG,CAAC,iBAAiB,EAAE,uBAAuB,CAAC,CAAC,CAAC;IAC5F,CAAC;SAAM,CAAC;QACN,8BAA8B;QAC9B,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,iBAAiB,EAAE,uBAAuB,CAAC,CAAC,CAAC;IAC5E,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC","sourcesContent":["// Copyright 2024 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\n// Lifted from Lighthouse: https://github.com/GoogleChrome/lighthouse/blob/36cac182a6c637b1671c57326d7c0241633d0076/shared/statistics.js\n\n/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\n// The exact double values for the max and min scores possible in each range.\nconst MIN_PASSING_SCORE = 0.90000000000000002220446049250313080847263336181640625;\nconst MAX_AVERAGE_SCORE = 0.899999999999999911182158029987476766109466552734375;\nconst MIN_AVERAGE_SCORE = 0.5;\nconst MAX_FAILING_SCORE = 0.499999999999999944488848768742172978818416595458984375;\n\n/**\n * Approximates the Gauss error function, the probability that a random variable\n * from the standard normal distribution lies within [-x, x]. Moved from\n * traceviewer.b.math.erf, based on Abramowitz and Stegun, formula 7.1.26.\n */\nfunction erf(x: number): number {\n  // erf(-x) = -erf(x);\n  const sign = Math.sign(x);\n  x = Math.abs(x);\n\n  const a1 = 0.254829592;\n  const a2 = -0.284496736;\n  const a3 = 1.421413741;\n  const a4 = -1.453152027;\n  const a5 = 1.061405429;\n  const p = 0.3275911;\n  const t = 1 / (1 + p * x);\n  const y = t * (a1 + t * (a2 + t * (a3 + t * (a4 + t * a5))));\n  return sign * (1 - y * Math.exp(-x * x));\n}\n\n/**\n * Returns the score (1 - percentile) of `value` in a log-normal distribution\n * specified by the `median` value, at which the score will be 0.5, and a 10th\n * percentile value, at which the score will be 0.9. The score represents the\n * amount of the distribution greater than `value`. All values should be in the\n * same units (e.g. milliseconds). See\n *   https://www.desmos.com/calculator/o98tbeyt1t\n * for an interactive view of the relationship between these parameters and the\n * typical parameterization (location and shape) of the log-normal distribution.\n */\nexport function getLogNormalScore({median, p10}: {median: number, p10: number}, value: number): number {\n  // Required for the log-normal distribution.\n  if (median <= 0) {\n    throw new Error('median must be greater than zero');\n  }\n  if (p10 <= 0) {\n    throw new Error('p10 must be greater than zero');\n  }\n  // Not strictly required, but if p10 > median, it flips around and becomes the p90 point.\n  if (p10 >= median) {\n    throw new Error('p10 must be less than the median');\n  }\n\n  // Non-positive values aren't in the distribution, so always 1.\n  if (value <= 0) {\n    return 1;\n  }\n\n  // Closest double to `erfc-1(1/5)`.\n  const INVERSE_ERFC_ONE_FIFTH = 0.9061938024368232;\n\n  // Shape (σ) is `|log(p10/median) / (sqrt(2)*erfc^-1(1/5))|` and\n  // standardizedX is `1/2 erfc(log(value/median) / (sqrt(2)*σ))`, so simplify a bit.\n  const xRatio = Math.max(Number.MIN_VALUE, value / median);  // value and median are > 0, so is ratio.\n  const xLogRatio = Math.log(xRatio);\n  const p10Ratio = Math.max(Number.MIN_VALUE, p10 / median);  // p10 and median are > 0, so is ratio.\n  const p10LogRatio = -Math.log(p10Ratio);                    // negate to keep σ positive.\n  const standardizedX = xLogRatio * INVERSE_ERFC_ONE_FIFTH / p10LogRatio;\n  const complementaryPercentile = (1 - erf(standardizedX)) / 2;\n\n  // Clamp to avoid floating-point out-of-bounds issues and keep score in expected range.\n  let score;\n  if (value <= p10) {\n    // Passing. Clamp to [0.9, 1].\n    score = Math.max(MIN_PASSING_SCORE, Math.min(1, complementaryPercentile));\n  } else if (value <= median) {\n    // Average. Clamp to [0.5, 0.9).\n    score = Math.max(MIN_AVERAGE_SCORE, Math.min(MAX_AVERAGE_SCORE, complementaryPercentile));\n  } else {\n    // Failing. Clamp to [0, 0.5).\n    score = Math.max(0, Math.min(MAX_FAILING_SCORE, complementaryPercentile));\n  }\n  return score;\n}\n"]}

package/models/trace/insights/ThirdParties.d.ts

@@ -4,8 +4,8 @@ import { type InsightModel, type InsightSetContext, type RequiredData } from './
 export declare function deps(): ['Meta', 'NetworkRequests', 'Renderer', 'ImagePainting'];
 export type ThirdPartiesInsightModel = InsightModel<{
     entityByRequest: Map<Types.Events.SyntheticNetworkRequest, Extras.ThirdParties.Entity>;
-    requestsByEntity: Map<Extras.ThirdParties.Entity, Types.Events.SyntheticNetworkRequest[]>;
-    summaryByRequest: Map<Types.Events.SyntheticNetworkRequest, Extras.ThirdParties.Summary>;
+    requestsByEntity: Map<Extras.ThirdParties.Entity, Types.Events.Event[]>;
+    summaryByEvent: Map<Types.Events.Event, Extras.ThirdParties.Summary>;
     summaryByEntity: Map<Extras.ThirdParties.Entity, Extras.ThirdParties.Summary>;
     /** The entity for this navigation's URL. Any other entity is from a third party. */
     firstPartyEntity?: Extras.ThirdParties.Entity;

package/models/trace/insights/ThirdParties.js

@@ -4,6 +4,7 @@
 // import * as i18n from '../../../core/i18n/i18n.js';
 import * as ThirdPartyWeb from '../../../third_party/third-party-web/third-party-web.js';
 import * as Extras from '../extras/extras.js';
+import * as Handlers from '../handlers/handlers.js';
 import * as Helpers from '../helpers/helpers.js';
 import { InsightCategory } from './types.js';
 const UIStrings = {
@@ -23,7 +24,7 @@ export function deps() {
 }
 function getRelatedEvents(summaries, firstPartyEntity) {
     const events = [];
-    for (const [entity, requests] of summaries.requestsByEntity.entries()) {
+    for (const [entity, requests] of summaries.eventsByEntity.entries()) {
         if (entity !== firstPartyEntity) {
             events.push(...requests);
         }
@@ -52,12 +53,12 @@ export function generateInsight(parsedTrace, context) {
     const { entityByRequest, madeUpEntityCache, summaries } = Extras.ThirdParties.getSummariesAndEntitiesForTraceBounds(parsedTrace, context.bounds, networkRequests);
     const firstPartyUrl = context.navigation?.args.data?.documentLoaderURL ?? parsedTrace.Meta.mainFrameURL;
     const firstPartyEntity = ThirdPartyWeb.ThirdPartyWeb.getEntity(firstPartyUrl) ||
-        Extras.ThirdParties.makeUpEntity(madeUpEntityCache, firstPartyUrl);
+        Handlers.Helpers.makeUpEntity(madeUpEntityCache, firstPartyUrl);
     return finalize({
         relatedEvents: getRelatedEvents(summaries, firstPartyEntity),
         entityByRequest,
-        requestsByEntity: summaries.requestsByEntity,
-        summaryByRequest: summaries.byRequest,
+        requestsByEntity: summaries.eventsByEntity,
+        summaryByEvent: summaries.byEvent,
         summaryByEntity: summaries.byEntity,
         firstPartyEntity,
     });

package/models/trace/insights/ThirdParties.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThirdParties.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/ThirdParties.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright 2024 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 i18n from '../../../core/i18n/i18n.js';\nimport * as ThirdPartyWeb from '../../../third_party/third-party-web/third-party-web.js';\nimport * as Extras from '../extras/extras.js';\nimport type * as Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport type * as Types from '../types/types.js';\n\nimport {InsightCategory, type InsightModel, type InsightSetContext, type RequiredData} from './types.js';\n\nconst UIStrings = {\n  /** Title of an insight that provides details about the code on a web page that the user doesn't control (referred to as \"third-party code\"). */\n  title: 'Third parties',\n  /**\n   * @description Description of a DevTools insight that identifies the code on the page that the user doesn't control.\n   * This is displayed after a user expands the section to see more. No character length limits.\n   */\n  description: 'Third party code can significantly impact load performance. ' +\n      '[Reduce and defer loading of third party code](https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/loading-third-party-javascript/) to prioritize your page\\'s content.',\n};\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/ThirdParties.ts', UIStrings);\nconst i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport function deps(): ['Meta', 'NetworkRequests', 'Renderer', 'ImagePainting'] {\n  return ['Meta', 'NetworkRequests', 'Renderer', 'ImagePainting'];\n}\n\nexport type ThirdPartiesInsightModel = InsightModel<{\n  entityByRequest: Map<Types.Events.SyntheticNetworkRequest, Extras.ThirdParties.Entity>,\n  requestsByEntity: Map<Extras.ThirdParties.Entity, Types.Events.SyntheticNetworkRequest[]>,\n  summaryByRequest: Map<Types.Events.SyntheticNetworkRequest, Extras.ThirdParties.Summary>,\n  summaryByEntity: Map<Extras.ThirdParties.Entity, Extras.ThirdParties.Summary>,\n  /** The entity for this navigation's URL. Any other entity is from a third party. */\n  firstPartyEntity?: Extras.ThirdParties.Entity,\n}>;\n\nfunction getRelatedEvents(\n    summaries: Extras.ThirdParties.SummaryMaps,\n    firstPartyEntity: Extras.ThirdParties.Entity|undefined): Types.Events.Event[] {\n  const events = [];\n\n  for (const [entity, requests] of summaries.requestsByEntity.entries()) {\n    if (entity !== firstPartyEntity) {\n      events.push(...requests);\n    }\n  }\n\n  return events;\n}\n\nfunction finalize(partialModel: Omit<ThirdPartiesInsightModel, 'title'|'description'|'category'|'shouldShow'>):\n    ThirdPartiesInsightModel {\n  return {\n    title: i18nString(UIStrings.title),\n    description: i18nString(UIStrings.description),\n    category: InsightCategory.ALL,\n    shouldShow:\n        Boolean([...partialModel.summaryByEntity.entries()].find(kv => kv[0] !== partialModel.firstPartyEntity)),\n    ...partialModel,\n  };\n}\n\nexport function generateInsight(\n    parsedTrace: RequiredData<typeof deps>, context: InsightSetContext): ThirdPartiesInsightModel {\n  const networkRequests = parsedTrace.NetworkRequests.byTime.filter(event => {\n    if (!context.navigation) {\n      return false;\n    }\n\n    if (event.args.data.frame !== context.frameId) {\n      return false;\n    }\n\n    return Helpers.Timing.eventIsInBounds(event, context.bounds);\n  });\n\n  const {entityByRequest, madeUpEntityCache, summaries} = Extras.ThirdParties.getSummariesAndEntitiesForTraceBounds(\n      parsedTrace as Handlers.Types.ParsedTrace, context.bounds, networkRequests);\n\n  const firstPartyUrl = context.navigation?.args.data?.documentLoaderURL ?? parsedTrace.Meta.mainFrameURL;\n  const firstPartyEntity = ThirdPartyWeb.ThirdPartyWeb.getEntity(firstPartyUrl) ||\n      Extras.ThirdParties.makeUpEntity(madeUpEntityCache, firstPartyUrl);\n\n  return finalize({\n    relatedEvents: getRelatedEvents(summaries, firstPartyEntity),\n    entityByRequest,\n    requestsByEntity: summaries.requestsByEntity,\n    summaryByRequest: summaries.byRequest,\n    summaryByEntity: summaries.byEntity,\n    firstPartyEntity,\n  });\n}\n"]}
+{"version":3,"file":"ThirdParties.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/ThirdParties.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright 2024 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 i18n from '../../../core/i18n/i18n.js';\nimport * as ThirdPartyWeb from '../../../third_party/third-party-web/third-party-web.js';\nimport * as Extras from '../extras/extras.js';\nimport * as Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport type * as Types from '../types/types.js';\n\nimport {InsightCategory, type InsightModel, type InsightSetContext, type RequiredData} from './types.js';\n\nconst UIStrings = {\n  /** Title of an insight that provides details about the code on a web page that the user doesn't control (referred to as \"third-party code\"). */\n  title: 'Third parties',\n  /**\n   * @description Description of a DevTools insight that identifies the code on the page that the user doesn't control.\n   * This is displayed after a user expands the section to see more. No character length limits.\n   */\n  description: 'Third party code can significantly impact load performance. ' +\n      '[Reduce and defer loading of third party code](https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/loading-third-party-javascript/) to prioritize your page\\'s content.',\n};\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/ThirdParties.ts', UIStrings);\nconst i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport function deps(): ['Meta', 'NetworkRequests', 'Renderer', 'ImagePainting'] {\n  return ['Meta', 'NetworkRequests', 'Renderer', 'ImagePainting'];\n}\n\nexport type ThirdPartiesInsightModel = InsightModel<{\n  entityByRequest: Map<Types.Events.SyntheticNetworkRequest, Extras.ThirdParties.Entity>,\n  requestsByEntity: Map<Extras.ThirdParties.Entity, Types.Events.Event[]>,\n  summaryByEvent: Map<Types.Events.Event, Extras.ThirdParties.Summary>,\n  summaryByEntity: Map<Extras.ThirdParties.Entity, Extras.ThirdParties.Summary>,\n  /** The entity for this navigation's URL. Any other entity is from a third party. */\n  firstPartyEntity?: Extras.ThirdParties.Entity,\n}>;\n\nfunction getRelatedEvents(\n    summaries: Extras.ThirdParties.SummaryMaps,\n    firstPartyEntity: Extras.ThirdParties.Entity|undefined): Types.Events.Event[] {\n  const events = [];\n\n  for (const [entity, requests] of summaries.eventsByEntity.entries()) {\n    if (entity !== firstPartyEntity) {\n      events.push(...requests);\n    }\n  }\n\n  return events;\n}\n\nfunction finalize(partialModel: Omit<ThirdPartiesInsightModel, 'title'|'description'|'category'|'shouldShow'>):\n    ThirdPartiesInsightModel {\n  return {\n    title: i18nString(UIStrings.title),\n    description: i18nString(UIStrings.description),\n    category: InsightCategory.ALL,\n    shouldShow:\n        Boolean([...partialModel.summaryByEntity.entries()].find(kv => kv[0] !== partialModel.firstPartyEntity)),\n    ...partialModel,\n  };\n}\n\nexport function generateInsight(\n    parsedTrace: RequiredData<typeof deps>, context: InsightSetContext): ThirdPartiesInsightModel {\n  const networkRequests = parsedTrace.NetworkRequests.byTime.filter(event => {\n    if (!context.navigation) {\n      return false;\n    }\n\n    if (event.args.data.frame !== context.frameId) {\n      return false;\n    }\n\n    return Helpers.Timing.eventIsInBounds(event, context.bounds);\n  });\n\n  const {entityByRequest, madeUpEntityCache, summaries} = Extras.ThirdParties.getSummariesAndEntitiesForTraceBounds(\n      parsedTrace as Handlers.Types.ParsedTrace, context.bounds, networkRequests);\n\n  const firstPartyUrl = context.navigation?.args.data?.documentLoaderURL ?? parsedTrace.Meta.mainFrameURL;\n  const firstPartyEntity = ThirdPartyWeb.ThirdPartyWeb.getEntity(firstPartyUrl) ||\n      Handlers.Helpers.makeUpEntity(madeUpEntityCache, firstPartyUrl);\n\n  return finalize({\n    relatedEvents: getRelatedEvents(summaries, firstPartyEntity),\n    entityByRequest,\n    requestsByEntity: summaries.eventsByEntity,\n    summaryByEvent: summaries.byEvent,\n    summaryByEntity: summaries.byEntity,\n    firstPartyEntity,\n  });\n}\n"]}

package/models/trace/insights/Viewport.js

@@ -6,11 +6,11 @@ import * as Helpers from '../helpers/helpers.js';
 import { InsightCategory, InsightWarning, } from './types.js';
 const UIStrings = {
     /** Title of an insight that provides details about if the page's viewport is optimized for mobile viewing. */
-    title: 'Viewport not optimized for mobile',
+    title: 'Optimize viewport for mobile',
     /**
      * @description Text to tell the user how a viewport meta element can improve performance. \xa0 is a non-breaking space
      */
-    description: 'The page\'s viewport is not mobile-optimized, so tap interactions may be [delayed by up to 300\xA0ms](https://developer.chrome.com/blog/300ms-tap-delay-gone-away/).',
+    description: 'Tap interactions may be [delayed by up to 300\xA0ms](https://developer.chrome.com/blog/300ms-tap-delay-gone-away/) if the viewport is not optimized for mobile.',
 };
 // const str_ = i18n.i18n.registerUIStrings('models/trace/insights/Viewport.ts', UIStrings);
 const i18nString = string => string; // i18n.i18n.getLocalizedString.bind(undefined, str_);

package/models/trace/insights/Viewport.js.map

@@ -1 +1 @@
-{"version":3,"file":"Viewport.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/Viewport.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,IAAI,MAAM,4BAA4B,CAAC;AACnD,OAAO,KAAK,OAAO,MAAM,uBAAuB,CAAC;AAGjD,OAAO,EACL,eAAe,EAGf,cAAc,GAEf,MAAM,YAAY,CAAC;AAEpB,MAAM,SAAS,GAAG;IAChB,8GAA8G;IAC9G,KAAK,EAAE,mCAAmC;IAC1C;;OAEG;IACH,WAAW,EACP,sKAAsK;CAC3K,CAAC;AAEF,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,mCAAmC,EAAE,SAAS,CAAC,CAAC;AACzF,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;AAEtE,MAAM,UAAU,IAAI;IAClB,OAAO,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;AACtC,CAAC;AAOD,SAAS,QAAQ,CAAC,YAAuF;IAEvG,OAAO;QACL,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,KAAK,CAAC;QAClC,WAAW,EAAE,UAAU,CAAC,SAAS,CAAC,WAAW,CAAC;QAC9C,QAAQ,EAAE,eAAe,CAAC,GAAG;QAC7B,UAAU,EAAE,YAAY,CAAC,eAAe,KAAK,KAAK;QAClD,GAAG,YAAY;KAChB,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,eAAe,CAC3B,WAAsC,EAAE,OAA0B;IACpE,MAAM,gBAAgB,GAAG,WAAW,CAAC,gBAAgB,CAAC,gCAAgC,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE;QACpG,IAAI,KAAK,CAAC,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,OAAO,EAAE,CAAC;YACzC,OAAO,KAAK,CAAC;QACf,CAAC;QAED,OAAO,OAAO,CAAC,MAAM,CAAC,eAAe,CAAC,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;IAC/D,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE,CAAC;QAC7B,uCAAuC;QACvC,OAAO,QAAQ,CAAC;YACd,eAAe,EAAE,IAAI;YACrB,QAAQ,EAAE,CAAC,cAAc,CAAC,SAAS,CAAC;SACrC,CAAC,CAAC;IACL,CAAC;IAED,MAAM,aAAa,GAAG,WAAW,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;QACtF,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,OAAO,EAAE,CAAC;YAC9C,OAAO,KAAK,CAAC;QACf,CAAC;QAED,OAAO,OAAO,CAAC,MAAM,CAAC,eAAe,CAAC,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;IAC/D,CAAC,CAAC,CAAC;IAEH,wDAAwD;IACxD,KAAK,MAAM,KAAK,IAAI,gBAAgB,EAAE,CAAC;QACrC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,mBAAmB,EAAE,CAAC;YACpC,OAAO,QAAQ,CAAC;gBACd,eAAe,EAAE,KAAK;gBACtB,aAAa;gBACb,aAAa,EAAE,EAAC,GAAG,EAAE,GAAgC,EAAC;aACvD,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,OAAO,QAAQ,CAAC;QACd,eAAe,EAAE,IAAI;QACrB,aAAa;KACd,CAAC,CAAC;AACL,CAAC","sourcesContent":["// Copyright 2024 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 i18n from '../../../core/i18n/i18n.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport type * as Types from '../types/types.js';\n\nimport {\n  InsightCategory,\n  type InsightModel,\n  type InsightSetContext,\n  InsightWarning,\n  type RequiredData,\n} from './types.js';\n\nconst UIStrings = {\n  /** Title of an insight that provides details about if the page's viewport is optimized for mobile viewing. */\n  title: 'Viewport not optimized for mobile',\n  /**\n   * @description Text to tell the user how a viewport meta element can improve performance. \\xa0 is a non-breaking space\n   */\n  description:\n      'The page\\'s viewport is not mobile-optimized, so tap interactions may be [delayed by up to 300\\xA0ms](https://developer.chrome.com/blog/300ms-tap-delay-gone-away/).',\n};\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/Viewport.ts', UIStrings);\nconst i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport function deps(): ['Meta', 'UserInteractions'] {\n  return ['Meta', 'UserInteractions'];\n}\n\nexport type ViewportInsightModel = InsightModel<{\n  mobileOptimized: boolean | null,\n  viewportEvent?: Types.Events.ParseMetaViewport,\n}>;\n\nfunction finalize(partialModel: Omit<ViewportInsightModel, 'title'|'description'|'category'|'shouldShow'>):\n    ViewportInsightModel {\n  return {\n    title: i18nString(UIStrings.title),\n    description: i18nString(UIStrings.description),\n    category: InsightCategory.INP,\n    shouldShow: partialModel.mobileOptimized === false,\n    ...partialModel,\n  };\n}\n\nexport function generateInsight(\n    parsedTrace: RequiredData<typeof deps>, context: InsightSetContext): ViewportInsightModel {\n  const compositorEvents = parsedTrace.UserInteractions.beginCommitCompositorFrameEvents.filter(event => {\n    if (event.args.frame !== context.frameId) {\n      return false;\n    }\n\n    return Helpers.Timing.eventIsInBounds(event, context.bounds);\n  });\n\n  if (!compositorEvents.length) {\n    // Trace doesn't have the data we need.\n    return finalize({\n      mobileOptimized: null,\n      warnings: [InsightWarning.NO_LAYOUT],\n    });\n  }\n\n  const viewportEvent = parsedTrace.UserInteractions.parseMetaViewportEvents.find(event => {\n    if (event.args.data.frame !== context.frameId) {\n      return false;\n    }\n\n    return Helpers.Timing.eventIsInBounds(event, context.bounds);\n  });\n\n  // Returns true only if all events are mobile optimized.\n  for (const event of compositorEvents) {\n    if (!event.args.is_mobile_optimized) {\n      return finalize({\n        mobileOptimized: false,\n        viewportEvent,\n        metricSavings: {INP: 300 as Types.Timing.MilliSeconds},\n      });\n    }\n  }\n\n  return finalize({\n    mobileOptimized: true,\n    viewportEvent,\n  });\n}\n"]}
+{"version":3,"file":"Viewport.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/Viewport.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,IAAI,MAAM,4BAA4B,CAAC;AACnD,OAAO,KAAK,OAAO,MAAM,uBAAuB,CAAC;AAGjD,OAAO,EACL,eAAe,EAGf,cAAc,GAEf,MAAM,YAAY,CAAC;AAEpB,MAAM,SAAS,GAAG;IAChB,8GAA8G;IAC9G,KAAK,EAAE,8BAA8B;IACrC;;OAEG;IACH,WAAW,EACP,iKAAiK;CACtK,CAAC;AAEF,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,mCAAmC,EAAE,SAAS,CAAC,CAAC;AACzF,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;AAEtE,MAAM,UAAU,IAAI;IAClB,OAAO,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;AACtC,CAAC;AAOD,SAAS,QAAQ,CAAC,YAAuF;IAEvG,OAAO;QACL,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,KAAK,CAAC;QAClC,WAAW,EAAE,UAAU,CAAC,SAAS,CAAC,WAAW,CAAC;QAC9C,QAAQ,EAAE,eAAe,CAAC,GAAG;QAC7B,UAAU,EAAE,YAAY,CAAC,eAAe,KAAK,KAAK;QAClD,GAAG,YAAY;KAChB,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,eAAe,CAC3B,WAAsC,EAAE,OAA0B;IACpE,MAAM,gBAAgB,GAAG,WAAW,CAAC,gBAAgB,CAAC,gCAAgC,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE;QACpG,IAAI,KAAK,CAAC,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,OAAO,EAAE,CAAC;YACzC,OAAO,KAAK,CAAC;QACf,CAAC;QAED,OAAO,OAAO,CAAC,MAAM,CAAC,eAAe,CAAC,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;IAC/D,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE,CAAC;QAC7B,uCAAuC;QACvC,OAAO,QAAQ,CAAC;YACd,eAAe,EAAE,IAAI;YACrB,QAAQ,EAAE,CAAC,cAAc,CAAC,SAAS,CAAC;SACrC,CAAC,CAAC;IACL,CAAC;IAED,MAAM,aAAa,GAAG,WAAW,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;QACtF,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,OAAO,EAAE,CAAC;YAC9C,OAAO,KAAK,CAAC;QACf,CAAC;QAED,OAAO,OAAO,CAAC,MAAM,CAAC,eAAe,CAAC,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;IAC/D,CAAC,CAAC,CAAC;IAEH,wDAAwD;IACxD,KAAK,MAAM,KAAK,IAAI,gBAAgB,EAAE,CAAC;QACrC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,mBAAmB,EAAE,CAAC;YACpC,OAAO,QAAQ,CAAC;gBACd,eAAe,EAAE,KAAK;gBACtB,aAAa;gBACb,aAAa,EAAE,EAAC,GAAG,EAAE,GAAgC,EAAC;aACvD,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,OAAO,QAAQ,CAAC;QACd,eAAe,EAAE,IAAI;QACrB,aAAa;KACd,CAAC,CAAC;AACL,CAAC","sourcesContent":["// Copyright 2024 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 i18n from '../../../core/i18n/i18n.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport type * as Types from '../types/types.js';\n\nimport {\n  InsightCategory,\n  type InsightModel,\n  type InsightSetContext,\n  InsightWarning,\n  type RequiredData,\n} from './types.js';\n\nconst UIStrings = {\n  /** Title of an insight that provides details about if the page's viewport is optimized for mobile viewing. */\n  title: 'Optimize viewport for mobile',\n  /**\n   * @description Text to tell the user how a viewport meta element can improve performance. \\xa0 is a non-breaking space\n   */\n  description:\n      'Tap interactions may be [delayed by up to 300\\xA0ms](https://developer.chrome.com/blog/300ms-tap-delay-gone-away/) if the viewport is not optimized for mobile.',\n};\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/Viewport.ts', UIStrings);\nconst i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport function deps(): ['Meta', 'UserInteractions'] {\n  return ['Meta', 'UserInteractions'];\n}\n\nexport type ViewportInsightModel = InsightModel<{\n  mobileOptimized: boolean | null,\n  viewportEvent?: Types.Events.ParseMetaViewport,\n}>;\n\nfunction finalize(partialModel: Omit<ViewportInsightModel, 'title'|'description'|'category'|'shouldShow'>):\n    ViewportInsightModel {\n  return {\n    title: i18nString(UIStrings.title),\n    description: i18nString(UIStrings.description),\n    category: InsightCategory.INP,\n    shouldShow: partialModel.mobileOptimized === false,\n    ...partialModel,\n  };\n}\n\nexport function generateInsight(\n    parsedTrace: RequiredData<typeof deps>, context: InsightSetContext): ViewportInsightModel {\n  const compositorEvents = parsedTrace.UserInteractions.beginCommitCompositorFrameEvents.filter(event => {\n    if (event.args.frame !== context.frameId) {\n      return false;\n    }\n\n    return Helpers.Timing.eventIsInBounds(event, context.bounds);\n  });\n\n  if (!compositorEvents.length) {\n    // Trace doesn't have the data we need.\n    return finalize({\n      mobileOptimized: null,\n      warnings: [InsightWarning.NO_LAYOUT],\n    });\n  }\n\n  const viewportEvent = parsedTrace.UserInteractions.parseMetaViewportEvents.find(event => {\n    if (event.args.data.frame !== context.frameId) {\n      return false;\n    }\n\n    return Helpers.Timing.eventIsInBounds(event, context.bounds);\n  });\n\n  // Returns true only if all events are mobile optimized.\n  for (const event of compositorEvents) {\n    if (!event.args.is_mobile_optimized) {\n      return finalize({\n        mobileOptimized: false,\n        viewportEvent,\n        metricSavings: {INP: 300 as Types.Timing.MilliSeconds},\n      });\n    }\n  }\n\n  return finalize({\n    mobileOptimized: true,\n    viewportEvent,\n  });\n}\n"]}

package/models/trace/insights/devtools_entrypoint-bundle-typescript-tsconfig.json

@@ -32,7 +32,8 @@
     "../../../../../../../front_end/models/trace/insights/insights.ts",
     "../../../../../../../front_end/legacy/legacy-defs.d.ts",
     "../../../../../../../front_end/global_typings/global_defs.d.ts",
-    "../../../../../../../node_modules/@types/filesystem/index.d.ts"
+    "../../../../../../../node_modules/@types/filesystem/index.d.ts",
+    "../../../../../../../node_modules/@types/wicg-task-scheduling/index.d.ts"
   ],
   "references": [
     {

package/models/trace/insights/insights-tsconfig.json

@@ -31,6 +31,7 @@
   "files": [
     "../../../../../../../front_end/models/trace/insights/CLSCulprits.ts",
     "../../../../../../../front_end/models/trace/insights/Common.ts",
+    "../../../../../../../front_end/models/trace/insights/DOMSize.ts",
     "../../../../../../../front_end/models/trace/insights/DocumentLatency.ts",
     "../../../../../../../front_end/models/trace/insights/FontDisplay.ts",
     "../../../../../../../front_end/models/trace/insights/ImageDelivery.ts",
@@ -40,12 +41,14 @@
     "../../../../../../../front_end/models/trace/insights/Models.ts",
     "../../../../../../../front_end/models/trace/insights/RenderBlocking.ts",
     "../../../../../../../front_end/models/trace/insights/SlowCSSSelector.ts",
+    "../../../../../../../front_end/models/trace/insights/Statistics.ts",
     "../../../../../../../front_end/models/trace/insights/ThirdParties.ts",
     "../../../../../../../front_end/models/trace/insights/Viewport.ts",
     "../../../../../../../front_end/models/trace/insights/types.ts",
     "../../../../../../../front_end/legacy/legacy-defs.d.ts",
     "../../../../../../../front_end/global_typings/global_defs.d.ts",
-    "../../../../../../../node_modules/@types/filesystem/index.d.ts"
+    "../../../../../../../node_modules/@types/filesystem/index.d.ts",
+    "../../../../../../../node_modules/@types/wicg-task-scheduling/index.d.ts"
   ],
   "references": [
     {

package/models/trace/insights/insights.d.ts

@@ -1,3 +1,4 @@
 export * as Common from './Common.js';
 export * as Models from './Models.js';
+export * as Statistics from './Statistics.js';
 export * as Types from './types.js';

package/models/trace/insights/insights.js

@@ -3,5 +3,6 @@
 // found in the LICENSE file.
 export * as Common from './Common.js';
 export * as Models from './Models.js';
+export * as Statistics from './Statistics.js';
 export * as Types from './types.js';
 //# sourceMappingURL=insights.js.map

package/models/trace/insights/insights.js.map

@@ -1 +1 @@
-{"version":3,"file":"insights.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/insights.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,MAAM,MAAM,aAAa,CAAC;AACtC,OAAO,KAAK,MAAM,MAAM,aAAa,CAAC;AACtC,OAAO,KAAK,KAAK,MAAM,YAAY,CAAC","sourcesContent":["// Copyright 2024 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\nexport * as Common from './Common.js';\nexport * as Models from './Models.js';\nexport * as Types from './types.js';\n"]}
+{"version":3,"file":"insights.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/insights.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,MAAM,MAAM,aAAa,CAAC;AACtC,OAAO,KAAK,MAAM,MAAM,aAAa,CAAC;AACtC,OAAO,KAAK,UAAU,MAAM,iBAAiB,CAAC;AAC9C,OAAO,KAAK,KAAK,MAAM,YAAY,CAAC","sourcesContent":["// Copyright 2024 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\nexport * as Common from './Common.js';\nexport * as Models from './Models.js';\nexport * as Statistics from './Statistics.js';\nexport * as Types from './types.js';\n"]}

package/models/trace/insights/types.d.ts

@@ -44,13 +44,14 @@ export declare enum InsightCategory {
     LCP = "LCP",
     CLS = "CLS"
 }
+export type RelatedEventsMap = Map<Types.Events.Event, string[]>;
 export type InsightModel<R extends Record<string, unknown>> = R & {
     title: string;
     description: string;
     category: InsightCategory;
     /** True if there is anything of interest to display to the user. */
     shouldShow: boolean;
-    relatedEvents?: Types.Events.Event[];
+    relatedEvents?: RelatedEventsMap | Types.Events.Event[];
     warnings?: InsightWarning[];
     metricSavings?: MetricSavings;
 };
@@ -59,7 +60,7 @@ export type InsightModel<R extends Record<string, unknown>> = R & {
  * this could instead represent the duration from the beginning of the trace up to the first recorded
  * navigation (or the end of the trace).
  */
-export type InsightSet = {
+export interface InsightSet {
     /** If for a navigation, this is the navigationId. Else it is Trace.Types.Events.NO_NAVIGATION. */
     id: Types.Events.NavigationId;
     /** The URL to show in the accordion list. */
@@ -68,7 +69,7 @@ export type InsightSet = {
     bounds: Types.Timing.TraceWindowMicroSeconds;
     model: InsightModels;
     navigation?: Types.Events.NavigationStart;
-};
+}
 /**
  * Contains insights for a specific insight set.
  */

package/models/trace/insights/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/types.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAoC7B,MAAM,CAAN,IAAY,cAMX;AAND,WAAY,cAAc;IACxB,iCAAe,CAAA;IACf,mCAAiB,CAAA;IACjB,uEAAuE;IACvE,6DAA2C,CAAA;IAC3C,yCAAuB,CAAA;AACzB,CAAC,EANW,cAAc,KAAd,cAAc,QAMzB;AAYD,MAAM,CAAN,IAAY,eAKX;AALD,WAAY,eAAe;IACzB,8BAAW,CAAA;IACX,8BAAW,CAAA;IACX,8BAAW,CAAA;IACX,8BAAW,CAAA;AACb,CAAC,EALW,eAAe,KAAf,eAAe,QAK1B","sourcesContent":["// Copyright 2024 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 Common from '../../../core/common/common.js';\nimport type * as Handlers from '../handlers/handlers.js';\nimport type * as Lantern from '../lantern/lantern.js';\nimport type * as Types from '../types/types.js';\n\nimport type * as Models from './Models.js';\n\n/**\n * Context for the portion of the trace an insight should look at.\n */\nexport type InsightSetContext = InsightSetContextWithoutNavigation|InsightSetContextWithNavigation;\n\nexport interface InsightSetContextWithoutNavigation {\n  bounds: Types.Timing.TraceWindowMicroSeconds;\n  frameId: string;\n  navigation?: never;\n}\n\nexport interface InsightSetContextWithNavigation {\n  bounds: Types.Timing.TraceWindowMicroSeconds;\n  frameId: string;\n  navigation: Types.Events.NavigationStart;\n  navigationId: string;\n  lantern?: LanternContext;\n}\n\nexport interface LanternContext {\n  graph: Lantern.Graph.Node<Types.Events.SyntheticNetworkRequest>;\n  simulator: Lantern.Simulation.Simulator<Types.Events.SyntheticNetworkRequest>;\n  metrics: Record<string, Lantern.Metrics.MetricResult>;\n}\n\nexport type InsightModelsType = typeof Models;\n\nexport enum InsightWarning {\n  NO_FP = 'NO_FP',\n  NO_LCP = 'NO_LCP',\n  // No network request could be identified as the primary HTML document.\n  NO_DOCUMENT_REQUEST = 'NO_DOCUMENT_REQUEST',\n  NO_LAYOUT = 'NO_LAYOUT',\n}\n\nexport interface MetricSavings {\n  /* eslint-disable @typescript-eslint/naming-convention */\n  FCP?: Types.Timing.MilliSeconds;\n  LCP?: Types.Timing.MilliSeconds;\n  TBT?: Types.Timing.MilliSeconds;\n  CLS?: number;\n  INP?: Types.Timing.MilliSeconds;\n  /* eslint-enable @typescript-eslint/naming-convention */\n}\n\nexport enum InsightCategory {\n  ALL = 'All',\n  INP = 'INP',\n  LCP = 'LCP',\n  CLS = 'CLS',\n}\n\nexport type InsightModel<R extends Record<string, unknown>> = R&{\n  title: Common.UIString.LocalizedString,\n  description: Common.UIString.LocalizedString,\n  category: InsightCategory,\n  /** True if there is anything of interest to display to the user. */\n  shouldShow: boolean,\n  relatedEvents?: Types.Events.Event[],\n  warnings?: InsightWarning[],\n  metricSavings?: MetricSavings,\n};\n\n/**\n * Contains insights for a specific navigation. If a trace began after a navigation already started,\n * this could instead represent the duration from the beginning of the trace up to the first recorded\n * navigation (or the end of the trace).\n */\nexport type InsightSet = {\n  /** If for a navigation, this is the navigationId. Else it is Trace.Types.Events.NO_NAVIGATION. */\n  id: Types.Events.NavigationId,\n  /** The URL to show in the accordion list. */\n  url: URL,\n  frameId: string,\n  bounds: Types.Timing.TraceWindowMicroSeconds,\n  model: InsightModels,\n  navigation?: Types.Events.NavigationStart,\n};\n\n/**\n * Contains insights for a specific insight set.\n */\nexport type InsightModels = {\n  [I in keyof InsightModelsType]: ReturnType<InsightModelsType[I]['generateInsight']>;\n};\n\n/**\n * Contains insights for the entire trace. Insights are mostly grouped by `navigationId`, with one exception:\n *\n * If the analyzed trace started after the navigation, and has meaningful work with that span, there is no\n * navigation to map it to. In this case `Types.Events.NO_NAVIGATION` is used for the key.\n */\nexport type TraceInsightSets = Map<Types.Events.NavigationId, InsightSet>;\n\n/**\n * Represents the narrow set of dependencies defined by an insight's `deps()` function. `Meta` is always included regardless of `deps()`.\n */\nexport type RequiredData<D extends() => Array<keyof typeof Handlers.ModelHandlers>> =\n    Handlers.Types.EnabledHandlerDataWithMeta<Pick<typeof Handlers.ModelHandlers, ReturnType<D>[number]>>;\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/types.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAoC7B,MAAM,CAAN,IAAY,cAMX;AAND,WAAY,cAAc;IACxB,iCAAe,CAAA;IACf,mCAAiB,CAAA;IACjB,uEAAuE;IACvE,6DAA2C,CAAA;IAC3C,yCAAuB,CAAA;AACzB,CAAC,EANW,cAAc,KAAd,cAAc,QAMzB;AAYD,MAAM,CAAN,IAAY,eAKX;AALD,WAAY,eAAe;IACzB,8BAAW,CAAA;IACX,8BAAW,CAAA;IACX,8BAAW,CAAA;IACX,8BAAW,CAAA;AACb,CAAC,EALW,eAAe,KAAf,eAAe,QAK1B","sourcesContent":["// Copyright 2024 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 Common from '../../../core/common/common.js';\nimport type * as Handlers from '../handlers/handlers.js';\nimport type * as Lantern from '../lantern/lantern.js';\nimport type * as Types from '../types/types.js';\n\nimport type * as Models from './Models.js';\n\n/**\n * Context for the portion of the trace an insight should look at.\n */\nexport type InsightSetContext = InsightSetContextWithoutNavigation|InsightSetContextWithNavigation;\n\nexport interface InsightSetContextWithoutNavigation {\n  bounds: Types.Timing.TraceWindowMicroSeconds;\n  frameId: string;\n  navigation?: never;\n}\n\nexport interface InsightSetContextWithNavigation {\n  bounds: Types.Timing.TraceWindowMicroSeconds;\n  frameId: string;\n  navigation: Types.Events.NavigationStart;\n  navigationId: string;\n  lantern?: LanternContext;\n}\n\nexport interface LanternContext {\n  graph: Lantern.Graph.Node<Types.Events.SyntheticNetworkRequest>;\n  simulator: Lantern.Simulation.Simulator<Types.Events.SyntheticNetworkRequest>;\n  metrics: Record<string, Lantern.Metrics.MetricResult>;\n}\n\nexport type InsightModelsType = typeof Models;\n\nexport enum InsightWarning {\n  NO_FP = 'NO_FP',\n  NO_LCP = 'NO_LCP',\n  // No network request could be identified as the primary HTML document.\n  NO_DOCUMENT_REQUEST = 'NO_DOCUMENT_REQUEST',\n  NO_LAYOUT = 'NO_LAYOUT',\n}\n\nexport interface MetricSavings {\n  /* eslint-disable @typescript-eslint/naming-convention */\n  FCP?: Types.Timing.MilliSeconds;\n  LCP?: Types.Timing.MilliSeconds;\n  TBT?: Types.Timing.MilliSeconds;\n  CLS?: number;\n  INP?: Types.Timing.MilliSeconds;\n  /* eslint-enable @typescript-eslint/naming-convention */\n}\n\nexport enum InsightCategory {\n  ALL = 'All',\n  INP = 'INP',\n  LCP = 'LCP',\n  CLS = 'CLS',\n}\n\nexport type RelatedEventsMap = Map<Types.Events.Event, string[]>;\n\nexport type InsightModel<R extends Record<string, unknown>> = R&{\n  title: Common.UIString.LocalizedString,\n  description: Common.UIString.LocalizedString,\n  category: InsightCategory,\n  /** True if there is anything of interest to display to the user. */\n  shouldShow: boolean,\n  relatedEvents?: RelatedEventsMap | Types.Events.Event[],\n  warnings?: InsightWarning[],\n  metricSavings?: MetricSavings,\n};\n\n/**\n * Contains insights for a specific navigation. If a trace began after a navigation already started,\n * this could instead represent the duration from the beginning of the trace up to the first recorded\n * navigation (or the end of the trace).\n */\nexport interface InsightSet {\n  /** If for a navigation, this is the navigationId. Else it is Trace.Types.Events.NO_NAVIGATION. */\n  id: Types.Events.NavigationId;\n  /** The URL to show in the accordion list. */\n  url: URL;\n  frameId: string;\n  bounds: Types.Timing.TraceWindowMicroSeconds;\n  model: InsightModels;\n  navigation?: Types.Events.NavigationStart;\n}\n\n/**\n * Contains insights for a specific insight set.\n */\nexport type InsightModels = {\n  [I in keyof InsightModelsType]: ReturnType<InsightModelsType[I]['generateInsight']>;\n};\n\n/**\n * Contains insights for the entire trace. Insights are mostly grouped by `navigationId`, with one exception:\n *\n * If the analyzed trace started after the navigation, and has meaningful work with that span, there is no\n * navigation to map it to. In this case `Types.Events.NO_NAVIGATION` is used for the key.\n */\nexport type TraceInsightSets = Map<Types.Events.NavigationId, InsightSet>;\n\n/**\n * Represents the narrow set of dependencies defined by an insight's `deps()` function. `Meta` is always included regardless of `deps()`.\n */\nexport type RequiredData<D extends() => Array<keyof typeof Handlers.ModelHandlers>> =\n    Handlers.Types.EnabledHandlerDataWithMeta<Pick<typeof Handlers.ModelHandlers, ReturnType<D>[number]>>;\n"]}

package/models/trace/lantern/core/NetworkAnalyzer.d.ts

@@ -24,11 +24,11 @@ interface RTTEstimateOptions {
     /** Useful for testing to isolate the different methods of estimation. */
     useHeadersEndEstimates?: boolean;
 }
-type RequestInfo = {
+interface RequestInfo {
     request: Lantern.NetworkRequest;
     timing: Lantern.ResourceTiming;
     connectionReused?: boolean;
-};
+}
 declare class NetworkAnalyzer {
     static get summary(): string;
     static groupByOrigin(records: Lantern.NetworkRequest[]): Map<string, Lantern.NetworkRequest[]>;

package/models/trace/lantern/core/NetworkAnalyzer.js

@@ -31,7 +31,7 @@ class UrlUtils {
             urlb.hash = '';
             return urla.href === urlb.href;
         }
-        catch (e) {
+        catch {
             return false;
         }
     }
@@ -310,7 +310,6 @@ class NetworkAnalyzer {
         const estimatesByOrigin = new Map();
         for (const [origin, originRequests] of groupedByOrigin.entries()) {
             const originEstimates = [];
-            // eslint-disable-next-line no-inner-declarations
             function collectEstimates(estimator, multiplier = 1) {
                 for (const request of originRequests) {
                     const timing = request.timing;
@@ -470,7 +469,7 @@ class NetworkAnalyzer {
     }
     static findLastDocumentForUrl(records, resourceUrl) {
         // equalWithExcludedFragments is expensive, so check that the resourceUrl starts with the request url first
-        const matchingRequests = records.filter(request => request.resourceType === 'Document' &&
+        const matchingRequests = records.filter(request => request.resourceType === 'Document' && !request.failed &&
             // Note: `request.url` should never have a fragment, else this optimization gives wrong results.
             resourceUrl.startsWith(request.url) && UrlUtils.equalWithExcludedFragments(request.url, resourceUrl));
         return matchingRequests[matchingRequests.length - 1];