@paulirish/trace_engine 0.0.47 → 0.0.49

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (169) hide show
  1. package/.tmp/tsbuildinfo/tsconfig.tsbuildinfo +1 -1
  2. package/core/platform/MimeType.js +3 -0
  3. package/core/platform/MimeType.js.map +1 -1
  4. package/core/platform/TypedArrayUtilities.d.ts +2 -1
  5. package/core/platform/TypedArrayUtilities.js +9 -4
  6. package/core/platform/TypedArrayUtilities.js.map +1 -1
  7. package/generated/protocol.d.ts +25 -2
  8. package/locales/af.json +229 -16
  9. package/locales/am.json +231 -18
  10. package/locales/ar.json +229 -16
  11. package/locales/as.json +231 -18
  12. package/locales/az.json +231 -18
  13. package/locales/be.json +228 -15
  14. package/locales/bg.json +229 -16
  15. package/locales/bn.json +229 -16
  16. package/locales/bs.json +229 -16
  17. package/locales/ca.json +229 -16
  18. package/locales/cs.json +228 -15
  19. package/locales/cy.json +231 -18
  20. package/locales/da.json +230 -17
  21. package/locales/de.json +228 -15
  22. package/locales/el.json +229 -16
  23. package/locales/en-GB.json +229 -16
  24. package/locales/en-US.json +30 -3
  25. package/locales/en-XL.json +30 -3
  26. package/locales/es-419.json +229 -16
  27. package/locales/es.json +228 -15
  28. package/locales/et.json +230 -17
  29. package/locales/eu.json +231 -18
  30. package/locales/fa.json +230 -17
  31. package/locales/fi.json +229 -16
  32. package/locales/fil.json +231 -18
  33. package/locales/fr-CA.json +230 -17
  34. package/locales/fr.json +230 -17
  35. package/locales/gl.json +228 -15
  36. package/locales/gu.json +230 -17
  37. package/locales/he.json +229 -16
  38. package/locales/hi.json +230 -17
  39. package/locales/hr.json +229 -16
  40. package/locales/hu.json +229 -16
  41. package/locales/hy.json +228 -15
  42. package/locales/id.json +228 -15
  43. package/locales/is.json +229 -16
  44. package/locales/it.json +232 -19
  45. package/locales/ja.json +228 -15
  46. package/locales/ka.json +230 -17
  47. package/locales/kk.json +230 -17
  48. package/locales/km.json +231 -18
  49. package/locales/kn.json +228 -15
  50. package/locales/ko.json +229 -16
  51. package/locales/ky.json +230 -17
  52. package/locales/lo.json +229 -16
  53. package/locales/lt.json +229 -16
  54. package/locales/lv.json +230 -17
  55. package/locales/mk.json +229 -16
  56. package/locales/ml.json +230 -17
  57. package/locales/mn.json +229 -16
  58. package/locales/mr.json +230 -17
  59. package/locales/ms.json +229 -16
  60. package/locales/my.json +231 -18
  61. package/locales/ne.json +229 -16
  62. package/locales/nl.json +229 -16
  63. package/locales/no.json +229 -16
  64. package/locales/or.json +231 -18
  65. package/locales/pa.json +228 -15
  66. package/locales/pl.json +230 -17
  67. package/locales/pt-PT.json +229 -16
  68. package/locales/pt.json +229 -16
  69. package/locales/ro.json +228 -15
  70. package/locales/ru.json +230 -17
  71. package/locales/si.json +231 -18
  72. package/locales/sk.json +229 -16
  73. package/locales/sl.json +230 -17
  74. package/locales/sq.json +229 -16
  75. package/locales/sr-Latn.json +229 -16
  76. package/locales/sr.json +229 -16
  77. package/locales/sv.json +229 -16
  78. package/locales/sw.json +231 -18
  79. package/locales/ta.json +230 -17
  80. package/locales/te.json +231 -18
  81. package/locales/th.json +229 -16
  82. package/locales/tr.json +230 -17
  83. package/locales/uk.json +229 -16
  84. package/locales/ur.json +230 -17
  85. package/locales/uz.json +229 -16
  86. package/locales/vi.json +230 -17
  87. package/locales/zh-HK.json +229 -16
  88. package/locales/zh-TW.json +230 -17
  89. package/locales/zh.json +228 -15
  90. package/locales/zu.json +230 -17
  91. package/models/trace/Processor.js +40 -11
  92. package/models/trace/Processor.js.map +1 -1
  93. package/models/trace/extras/ScriptDuplication.d.ts +27 -8
  94. package/models/trace/extras/ScriptDuplication.js +27 -26
  95. package/models/trace/extras/ScriptDuplication.js.map +1 -1
  96. package/models/trace/extras/StackTraceForEvent.js +7 -0
  97. package/models/trace/extras/StackTraceForEvent.js.map +1 -1
  98. package/models/trace/handlers/ExtensionTraceDataHandler.js +14 -9
  99. package/models/trace/handlers/ExtensionTraceDataHandler.js.map +1 -1
  100. package/models/trace/handlers/LargestImagePaintHandler.d.ts +1 -1
  101. package/models/trace/handlers/LargestImagePaintHandler.js +3 -3
  102. package/models/trace/handlers/LargestImagePaintHandler.js.map +1 -1
  103. package/models/trace/handlers/MetaHandler.d.ts +13 -0
  104. package/models/trace/handlers/MetaHandler.js +34 -1
  105. package/models/trace/handlers/MetaHandler.js.map +1 -1
  106. package/models/trace/helpers/Network.d.ts +18 -0
  107. package/models/trace/helpers/Network.js +57 -0
  108. package/models/trace/helpers/Network.js.map +1 -1
  109. package/models/trace/helpers/SamplesIntegrator.js +1 -1
  110. package/models/trace/helpers/SamplesIntegrator.js.map +1 -1
  111. package/models/trace/helpers/Trace.js +4 -0
  112. package/models/trace/helpers/Trace.js.map +1 -1
  113. package/models/trace/insights/CLSCulprits.js +0 -1
  114. package/models/trace/insights/CLSCulprits.js.map +1 -1
  115. package/models/trace/insights/DOMSize.js +0 -1
  116. package/models/trace/insights/DOMSize.js.map +1 -1
  117. package/models/trace/insights/DocumentLatency.d.ts +2 -1
  118. package/models/trace/insights/DocumentLatency.js +5 -3
  119. package/models/trace/insights/DocumentLatency.js.map +1 -1
  120. package/models/trace/insights/{DuplicateJavaScript.d.ts → DuplicatedJavaScript.d.ts} +6 -1
  121. package/models/trace/insights/{DuplicateJavaScript.js → DuplicatedJavaScript.js} +15 -6
  122. package/models/trace/insights/DuplicatedJavaScript.js.map +1 -0
  123. package/models/trace/insights/FontDisplay.d.ts +1 -2
  124. package/models/trace/insights/FontDisplay.js +0 -1
  125. package/models/trace/insights/FontDisplay.js.map +1 -1
  126. package/models/trace/insights/ForcedReflow.d.ts +22 -2
  127. package/models/trace/insights/ForcedReflow.js +62 -107
  128. package/models/trace/insights/ForcedReflow.js.map +1 -1
  129. package/models/trace/insights/ImageDelivery.js +0 -1
  130. package/models/trace/insights/ImageDelivery.js.map +1 -1
  131. package/models/trace/insights/InteractionToNextPaint.js +1 -4
  132. package/models/trace/insights/InteractionToNextPaint.js.map +1 -1
  133. package/models/trace/insights/LCPDiscovery.js +5 -8
  134. package/models/trace/insights/LCPDiscovery.js.map +1 -1
  135. package/models/trace/insights/LCPPhases.js +4 -8
  136. package/models/trace/insights/LCPPhases.js.map +1 -1
  137. package/models/trace/insights/Models.d.ts +2 -1
  138. package/models/trace/insights/Models.js +2 -1
  139. package/models/trace/insights/Models.js.map +1 -1
  140. package/models/trace/insights/NetworkDependencyTree.d.ts +2 -1
  141. package/models/trace/insights/NetworkDependencyTree.js +9 -6
  142. package/models/trace/insights/NetworkDependencyTree.js.map +1 -1
  143. package/models/trace/insights/RenderBlocking.js +1 -4
  144. package/models/trace/insights/RenderBlocking.js.map +1 -1
  145. package/models/trace/insights/SlowCSSSelector.js +0 -1
  146. package/models/trace/insights/SlowCSSSelector.js.map +1 -1
  147. package/models/trace/insights/Statistics.d.ts +4 -0
  148. package/models/trace/insights/Statistics.js +7 -0
  149. package/models/trace/insights/Statistics.js.map +1 -1
  150. package/models/trace/insights/ThirdParties.js +0 -1
  151. package/models/trace/insights/ThirdParties.js.map +1 -1
  152. package/models/trace/insights/UseCache.d.ts +69 -0
  153. package/models/trace/insights/UseCache.js +189 -0
  154. package/models/trace/insights/UseCache.js.map +1 -0
  155. package/models/trace/insights/Viewport.js +0 -3
  156. package/models/trace/insights/Viewport.js.map +1 -1
  157. package/models/trace/insights/insights-tsconfig.json +2 -1
  158. package/models/trace/insights/types.d.ts +3 -15
  159. package/models/trace/insights/types.js.map +1 -1
  160. package/models/trace/lantern/types/types-tsconfig.json +1 -1
  161. package/models/trace/types/Configuration.d.ts +6 -0
  162. package/models/trace/types/Configuration.js.map +1 -1
  163. package/models/trace/types/TraceEvents.d.ts +16 -4
  164. package/models/trace/types/TraceEvents.js +4 -1
  165. package/models/trace/types/TraceEvents.js.map +1 -1
  166. package/models/trace/types/types-tsconfig.json +3 -0
  167. package/package.json +1 -1
  168. package/test/test-trace-engine.mjs +2 -1
  169. package/models/trace/insights/DuplicateJavaScript.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"LCPPhases.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/LCPPhases.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 Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport * as Types from '../types/types.js';\n\nimport {\n InsightCategory,\n InsightKeys,\n type InsightModel,\n type InsightSetContext,\n InsightWarning,\n type PartialInsightModel,\n} from './types.js';\n\nexport const 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 /**\n *@description Time to first byte title for the Largest Contentful Paint's phases timespan breakdown.\n */\n timeToFirstByte: 'Time to first byte',\n /**\n *@description Resource load delay title for the Largest Contentful Paint phases timespan breakdown.\n */\n resourceLoadDelay: 'Resource load delay',\n /**\n *@description Resource load duration title for the Largest Contentful Paint phases timespan breakdown.\n */\n resourceLoadDuration: 'Resource load duration',\n /**\n *@description Element render delay title for the Largest Contentful Paint phases timespan breakdown.\n */\n elementRenderDelay: 'Element render delay',\n /**\n *@description Label used for the phase/component/stage/section of a larger duration.\n */\n phase: 'Phase',\n /**\n * @description Label used for the duration a single phase/component/stage/section takes up of a larger duration.\n */\n duration: 'Duration',\n /**\n * @description Label used for the duration a single phase/component/stage/section takes up of a larger duration. The value will be the 75th percentile of aggregate data. \"Field\" means that the data was collected from real users in the field as opposed to the developers local environment. \"Field\" is synonymous with \"Real user data\".\n */\n fieldDuration: 'Field 75th percentile',\n /**\n * @description Text status indicating that the the Largest Contentful Paint (LCP) metric timing was not found. \"LCP\" is an acronym and should not be translated.\n */\n noLcp: 'No LCP detected',\n} as const;\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/LCPPhases.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\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.Milli;\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.Milli;\n /**\n * The time it takes to load the LCP request.\n */\n loadTime?: Types.Timing.Milli;\n /**\n * The time between when the LCP request finishes loading and when\n * the LCP element is rendered.\n */\n renderDelay: Types.Timing.Milli;\n}\n\nexport function isLCPPhases(model: InsightModel): model is LCPPhasesInsightModel {\n return model.insightKey === 'LCPPhases';\n}\nexport type LCPPhasesInsightModel = InsightModel<typeof UIStrings, {\n lcpMs?: Types.Timing.Milli,\n lcpTs?: Types.Timing.Milli,\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, lcpMs: Types.Timing.Milli,\n 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.Micro(firstDocByteTs - nav.ts);\n const ttfb = Helpers.Timing.microToMilli(firstDocByteTiming);\n let renderDelay = Types.Timing.Milli(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.Micro(lcpRequest.ts - nav.ts);\n const requestStart = Helpers.Timing.microToMilli(lcpStartTs);\n\n const lcpReqEndTs = Types.Timing.Micro(lcpRequest.args.data.syntheticData.finishTime - nav.ts);\n const requestEnd = Helpers.Timing.microToMilli(lcpReqEndTs);\n\n const loadDelay = Types.Timing.Milli(requestStart - ttfb);\n const loadTime = Types.Timing.Milli(requestEnd - requestStart);\n renderDelay = Types.Timing.Milli(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: PartialInsightModel<LCPPhasesInsightModel>): 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 insightKey: InsightKeys.LCP_PHASES,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.LCP,\n state: partialModel.lcpEvent || partialModel.lcpRequest ? 'informative' : 'pass',\n ...partialModel,\n relatedEvents,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): LCPPhasesInsightModel {\n if (!context.navigation) {\n return finalize({\n\n frameId: context.frameId,\n });\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({frameId: context.frameId, 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(\n {frameId: context.frameId, lcpMs, lcpTs, lcpEvent, lcpRequest, warnings: [InsightWarning.NO_DOCUMENT_REQUEST]});\n }\n\n if (!lcpRequest) {\n return finalize({\n frameId: context.frameId,\n lcpMs,\n lcpTs,\n lcpEvent,\n lcpRequest,\n phases: breakdownPhases(context.navigation, docRequest, lcpMs, lcpRequest) ?? undefined,\n });\n }\n\n return finalize({\n frameId: context.frameId,\n lcpMs,\n lcpTs,\n lcpEvent,\n lcpRequest,\n phases: breakdownPhases(context.navigation, docRequest, lcpMs, lcpRequest) ?? undefined,\n });\n}\n"]}
1
+ {"version":3,"file":"LCPPhases.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/LCPPhases.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 Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport * as Types from '../types/types.js';\n\nimport {\n InsightCategory,\n InsightKeys,\n type InsightModel,\n type InsightSetContext,\n InsightWarning,\n type PartialInsightModel,\n} from './types.js';\n\nexport const 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 /**\n *@description Time to first byte title for the Largest Contentful Paint's phases timespan breakdown.\n */\n timeToFirstByte: 'Time to first byte',\n /**\n *@description Resource load delay title for the Largest Contentful Paint phases timespan breakdown.\n */\n resourceLoadDelay: 'Resource load delay',\n /**\n *@description Resource load duration title for the Largest Contentful Paint phases timespan breakdown.\n */\n resourceLoadDuration: 'Resource load duration',\n /**\n *@description Element render delay title for the Largest Contentful Paint phases timespan breakdown.\n */\n elementRenderDelay: 'Element render delay',\n /**\n *@description Label used for the phase/component/stage/section of a larger duration.\n */\n phase: 'Phase',\n /**\n * @description Label used for the duration a single phase/component/stage/section takes up of a larger duration.\n */\n duration: 'Duration',\n /**\n * @description Label used for the duration a single phase/component/stage/section takes up of a larger duration. The value will be the 75th percentile of aggregate data. \"Field\" means that the data was collected from real users in the field as opposed to the developers local environment. \"Field\" is synonymous with \"Real user data\".\n */\n fieldDuration: 'Field 75th percentile',\n /**\n * @description Text status indicating that the the Largest Contentful Paint (LCP) metric timing was not found. \"LCP\" is an acronym and should not be translated.\n */\n noLcp: 'No LCP detected',\n} as const;\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/LCPPhases.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\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.Milli;\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.Milli;\n /**\n * The time it takes to load the LCP request.\n */\n loadTime?: Types.Timing.Milli;\n /**\n * The time between when the LCP request finishes loading and when\n * the LCP element is rendered.\n */\n renderDelay: Types.Timing.Milli;\n}\n\nexport function isLCPPhases(model: InsightModel): model is LCPPhasesInsightModel {\n return model.insightKey === 'LCPPhases';\n}\nexport type LCPPhasesInsightModel = InsightModel<typeof UIStrings, {\n lcpMs?: Types.Timing.Milli,\n lcpTs?: Types.Timing.Milli,\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, lcpMs: Types.Timing.Milli,\n 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.Micro(firstDocByteTs - nav.ts);\n const ttfb = Helpers.Timing.microToMilli(firstDocByteTiming);\n let renderDelay = Types.Timing.Milli(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.Micro(lcpRequest.ts - nav.ts);\n const requestStart = Helpers.Timing.microToMilli(lcpStartTs);\n\n const lcpReqEndTs = Types.Timing.Micro(lcpRequest.args.data.syntheticData.finishTime - nav.ts);\n const requestEnd = Helpers.Timing.microToMilli(lcpReqEndTs);\n\n const loadDelay = Types.Timing.Milli(requestStart - ttfb);\n const loadTime = Types.Timing.Milli(requestEnd - requestStart);\n renderDelay = Types.Timing.Milli(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: PartialInsightModel<LCPPhasesInsightModel>): 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 insightKey: InsightKeys.LCP_PHASES,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.LCP,\n state: partialModel.lcpEvent || partialModel.lcpRequest ? 'informative' : 'pass',\n ...partialModel,\n relatedEvents,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, 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.lcpRequestByNavigationId.get(context.navigationId);\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"]}
@@ -1,7 +1,7 @@
1
1
  export * as CLSCulprits from './CLSCulprits.js';
2
2
  export * as DocumentLatency from './DocumentLatency.js';
3
3
  export * as DOMSize from './DOMSize.js';
4
- export * as DuplicateJavaScript from './DuplicateJavaScript.js';
4
+ export * as DuplicatedJavaScript from './DuplicatedJavaScript.js';
5
5
  export * as FontDisplay from './FontDisplay.js';
6
6
  export * as ForcedReflow from './ForcedReflow.js';
7
7
  export * as ImageDelivery from './ImageDelivery.js';
@@ -12,4 +12,5 @@ export * as NetworkDependencyTree from './NetworkDependencyTree.js';
12
12
  export * as RenderBlocking from './RenderBlocking.js';
13
13
  export * as SlowCSSSelector from './SlowCSSSelector.js';
14
14
  export * as ThirdParties from './ThirdParties.js';
15
+ export * as UseCache from './UseCache.js';
15
16
  export * as Viewport from './Viewport.js';
@@ -4,7 +4,7 @@
4
4
  export * as CLSCulprits from './CLSCulprits.js';
5
5
  export * as DocumentLatency from './DocumentLatency.js';
6
6
  export * as DOMSize from './DOMSize.js';
7
- export * as DuplicateJavaScript from './DuplicateJavaScript.js';
7
+ export * as DuplicatedJavaScript from './DuplicatedJavaScript.js';
8
8
  export * as FontDisplay from './FontDisplay.js';
9
9
  export * as ForcedReflow from './ForcedReflow.js';
10
10
  export * as ImageDelivery from './ImageDelivery.js';
@@ -15,5 +15,6 @@ export * as NetworkDependencyTree from './NetworkDependencyTree.js';
15
15
  export * as RenderBlocking from './RenderBlocking.js';
16
16
  export * as SlowCSSSelector from './SlowCSSSelector.js';
17
17
  export * as ThirdParties from './ThirdParties.js';
18
+ export * as UseCache from './UseCache.js';
18
19
  export * as Viewport from './Viewport.js';
19
20
  //# sourceMappingURL=Models.js.map
@@ -1 +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,OAAO,MAAM,cAAc,CAAC;AACxC,OAAO,KAAK,mBAAmB,MAAM,0BAA0B,CAAC;AAChE,OAAO,KAAK,WAAW,MAAM,kBAAkB,CAAC;AAChD,OAAO,KAAK,YAAY,MAAM,mBAAmB,CAAC;AAClD,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,qBAAqB,MAAM,4BAA4B,CAAC;AACpE,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 DuplicateJavaScript from './DuplicateJavaScript.js';\nexport * as FontDisplay from './FontDisplay.js';\nexport * as ForcedReflow from './ForcedReflow.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 NetworkDependencyTree from './NetworkDependencyTree.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"]}
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,OAAO,MAAM,cAAc,CAAC;AACxC,OAAO,KAAK,oBAAoB,MAAM,2BAA2B,CAAC;AAClE,OAAO,KAAK,WAAW,MAAM,kBAAkB,CAAC;AAChD,OAAO,KAAK,YAAY,MAAM,mBAAmB,CAAC;AAClD,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,qBAAqB,MAAM,4BAA4B,CAAC;AACpE,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;AAC1C,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 DuplicatedJavaScript from './DuplicatedJavaScript.js';\nexport * as FontDisplay from './FontDisplay.js';\nexport * as ForcedReflow from './ForcedReflow.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 NetworkDependencyTree from './NetworkDependencyTree.js';\nexport * as RenderBlocking from './RenderBlocking.js';\nexport * as SlowCSSSelector from './SlowCSSSelector.js';\nexport * as ThirdParties from './ThirdParties.js';\nexport * as UseCache from './UseCache.js';\nexport * as Viewport from './Viewport.js';\n"]}
@@ -30,10 +30,11 @@ export interface CriticalRequestNode {
30
30
  timeFromInitialRequest: Types.Timing.Micro;
31
31
  children: CriticalRequestNode[];
32
32
  isLongest?: boolean;
33
- chain?: Types.Events.SyntheticNetworkRequest[];
33
+ relatedRequests: Set<Types.Events.SyntheticNetworkRequest>;
34
34
  }
35
35
  export type NetworkDependencyTreeInsightModel = InsightModel<typeof UIStrings, {
36
36
  rootNodes: CriticalRequestNode[];
37
37
  maxTime: Types.Timing.Micro;
38
+ fail: boolean;
38
39
  }>;
39
40
  export declare function generateInsight(_parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): NetworkDependencyTreeInsightModel;
@@ -45,7 +45,7 @@ function finalize(partialModel) {
45
45
  title: i18nString(UIStrings.title),
46
46
  description: i18nString(UIStrings.description),
47
47
  category: InsightCategory.LCP,
48
- state: partialModel.rootNodes.length > 0 ? 'fail' : 'pass',
48
+ state: partialModel.fail ? 'fail' : 'pass',
49
49
  ...partialModel,
50
50
  };
51
51
  }
@@ -79,19 +79,23 @@ function isCritical(request, context) {
79
79
  export function generateInsight(_parsedTrace, context) {
80
80
  if (!context.navigation) {
81
81
  return finalize({
82
- frameId: context.frameId,
83
82
  rootNodes: [],
84
83
  maxTime: Types.Timing.Micro(0),
84
+ fail: false,
85
85
  });
86
86
  }
87
87
  const rootNodes = [];
88
88
  const relatedEvents = new Map();
89
89
  let maxTime = Types.Timing.Micro(0);
90
+ let fail = false;
90
91
  let longestChain = [];
91
92
  function addChain(path) {
92
93
  if (path.length === 0) {
93
94
  return;
94
95
  }
96
+ if (path.length >= 2) {
97
+ fail = true;
98
+ }
95
99
  const initialRequest = path[0];
96
100
  const lastRequest = path[path.length - 1];
97
101
  const totalChainTime = Types.Timing.Micro(lastRequest.ts + lastRequest.dur - initialRequest.ts);
@@ -110,12 +114,11 @@ export function generateInsight(_parsedTrace, context) {
110
114
  request,
111
115
  timeFromInitialRequest,
112
116
  children: [],
117
+ relatedRequests: new Set(),
113
118
  };
114
119
  currentNodes.push(found);
115
120
  }
116
- if (request === lastRequest) {
117
- found.chain = path;
118
- }
121
+ path.forEach(request => found?.relatedRequests.add(request));
119
122
  // TODO(b/372897712) Switch the UIString to markdown.
120
123
  relatedEvents.set(request, depth < 2 ? [] : [i18nString(UIStrings.warningDescription)]);
121
124
  currentNodes = found.children;
@@ -163,9 +166,9 @@ export function generateInsight(_parsedTrace, context) {
163
166
  }
164
167
  }
165
168
  return finalize({
166
- frameId: context.frameId,
167
169
  rootNodes,
168
170
  maxTime,
171
+ fail,
169
172
  relatedEvents,
170
173
  });
171
174
  }
@@ -1 +1 @@
1
- {"version":3,"file":"NetworkDependencyTree.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/NetworkDependencyTree.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright 2025 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 Protocol from '../../../generated/protocol.js';\nimport type * as Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport type * as Lantern from '../lantern/lantern.js';\nimport * as Types from '../types/types.js';\n\nimport {\n InsightCategory,\n InsightKeys,\n type InsightModel,\n type InsightSetContext,\n type InsightSetContextWithNavigation,\n type PartialInsightModel,\n type RelatedEventsMap,\n} from './types.js';\n\nexport const UIStrings = {\n /**\n * @description Title of an insight that recommends avoiding chaining critical requests.\n */\n title: 'Network dependency tree',\n /**\n * @description Description of an insight that recommends avoiding chaining critical requests.\n */\n description:\n '[Avoid chaining critical requests](https://developer.chrome.com/docs/lighthouse/performance/critical-request-chains) by reducing the length of chains, reducing the download size of resources, or deferring the download of unnecessary resources to improve page load.',\n /**\n * @description Description of the warning that recommends avoiding chaining critical requests.\n */\n warningDescription:\n 'Avoid chaining critical requests by reducing the length of chains, reducing the download size of resources, or deferring the download of unnecessary resources to improve page load.',\n /**\n * @description Text status indicating that there isn't long chaining critical network requests.\n */\n noNetworkDependencyTree: 'No rendering tasks impacted by network dependencies',\n /**\n * @description Text for the maximum critical path latency. This refers to the longest chain of network requests that\n * the browser must download before it can render the page.\n */\n maxCriticalPathLatency: 'Max critical path latency:'\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/NetworkDependencyTree.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\n// XHRs are fetched at High priority, but we exclude them, as they are unlikely to be critical\n// Images are also non-critical.\nconst nonCriticalResourceTypes = new Set<Protocol.Network.ResourceType>([\n Protocol.Network.ResourceType.Image,\n Protocol.Network.ResourceType.XHR,\n Protocol.Network.ResourceType.Fetch,\n Protocol.Network.ResourceType.EventSource,\n]);\n\nexport interface CriticalRequestNode {\n request: Types.Events.SyntheticNetworkRequest;\n timeFromInitialRequest: Types.Timing.Micro;\n children: CriticalRequestNode[];\n isLongest?: boolean;\n chain?: Types.Events.SyntheticNetworkRequest[];\n}\n\nexport type NetworkDependencyTreeInsightModel = InsightModel<typeof UIStrings, {\n rootNodes: CriticalRequestNode[],\n maxTime: Types.Timing.Micro,\n}>;\n\nfunction finalize(partialModel: PartialInsightModel<NetworkDependencyTreeInsightModel>):\n NetworkDependencyTreeInsightModel {\n return {\n insightKey: InsightKeys.NETWORK_DEPENDENCY_TREE,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.LCP,\n state: partialModel.rootNodes.length > 0 ? 'fail' : 'pass',\n ...partialModel,\n };\n}\n\nfunction isCritical(request: Types.Events.SyntheticNetworkRequest, context: InsightSetContextWithNavigation): boolean {\n // The main resource is always critical.\n if (request.args.data.requestId === context.navigationId) {\n return true;\n }\n\n // Treat any preloaded resource as non-critical\n if (request.args.data.isLinkPreload) {\n return false;\n }\n\n // Iframes are considered High Priority but they are not render blocking\n const isIframe = request.args.data.resourceType === Protocol.Network.ResourceType.Document &&\n request.args.data.frame !== context.frameId;\n\n if (nonCriticalResourceTypes.has(request.args.data.resourceType) || isIframe ||\n // Treat any missed images, primarily favicons, as non-critical resources\n request.args.data.mimeType.startsWith('image/')) {\n return false;\n }\n\n // Requests that have no initiatorRequest are typically ambiguous late-load assets.\n // Even on the off chance they were important, we don't have any parent to display for them.\n const initiatorUrl =\n request.args.data.initiator?.url || Helpers.Trace.getZeroIndexedStackTraceForEvent(request)?.at(0)?.url;\n if (!initiatorUrl) {\n return false;\n }\n\n const isBlocking = Helpers.Network.isSyntheticNetworkRequestEventRenderBlocking(request);\n const isHighPriority = Helpers.Network.isSyntheticNetworkRequestHighPriority(request);\n return isHighPriority || isBlocking;\n}\n\nexport function generateInsight(\n _parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): NetworkDependencyTreeInsightModel {\n if (!context.navigation) {\n return finalize({\n frameId: context.frameId,\n rootNodes: [],\n maxTime: Types.Timing.Micro(0),\n });\n }\n\n const rootNodes: CriticalRequestNode[] = [];\n const relatedEvents: RelatedEventsMap = new Map();\n let maxTime = Types.Timing.Micro(0);\n\n let longestChain: Types.Events.SyntheticNetworkRequest[] = [];\n\n function addChain(path: Types.Events.SyntheticNetworkRequest[]): void {\n if (path.length === 0) {\n return;\n }\n const initialRequest = path[0];\n const lastRequest = path[path.length - 1];\n const totalChainTime = Types.Timing.Micro(lastRequest.ts + lastRequest.dur - initialRequest.ts);\n if (totalChainTime > maxTime) {\n maxTime = totalChainTime;\n longestChain = path;\n }\n\n let currentNodes = rootNodes;\n\n for (let depth = 0; depth < path.length; ++depth) {\n const request = path[depth];\n // find the request\n let found = currentNodes.find(node => node.request === request);\n\n if (!found) {\n const timeFromInitialRequest = Types.Timing.Micro(request.ts + request.dur - initialRequest.ts);\n found = {\n request,\n timeFromInitialRequest,\n children: [],\n };\n currentNodes.push(found);\n }\n\n if (request === lastRequest) {\n found.chain = path;\n }\n // TODO(b/372897712) Switch the UIString to markdown.\n relatedEvents.set(request, depth < 2 ? [] : [i18nString(UIStrings.warningDescription)]);\n\n currentNodes = found.children;\n }\n }\n // By default `traverse` will discover nodes in BFS-order regardless of dependencies, but\n // here we need traversal in a topological sort order. We'll visit a node only when its\n // dependencies have been met.\n const seenNodes = new Set<Lantern.Graph.Node<Types.Events.SyntheticNetworkRequest>>();\n function getNextNodes(node: Lantern.Graph.Node<Types.Events.SyntheticNetworkRequest>):\n Array<Lantern.Graph.Node<Types.Events.SyntheticNetworkRequest>> {\n return node.getDependents().filter(n => n.getDependencies().every(d => seenNodes.has(d)));\n }\n\n context.lantern?.graph.traverse((node, traversalPath) => {\n seenNodes.add(node);\n if (node.type !== 'network') {\n return;\n }\n const networkNode = node;\n if (!isCritical(networkNode.rawRequest, context)) {\n return;\n }\n\n const networkPath = traversalPath.filter(node => node.type === 'network').reverse().map(node => node.rawRequest);\n\n // Ignore if some ancestor is not a critical request.\n if (networkPath.some(request => (!isCritical(request, context)))) {\n return;\n }\n\n // Ignore non-network things (like data urls).\n if (node.isNonNetworkProtocol) {\n return;\n }\n\n addChain(networkPath);\n }, getNextNodes);\n\n // Mark the longest chain\n if (longestChain.length > 0) {\n let currentNodes = rootNodes;\n for (const request of longestChain) {\n const found = currentNodes.find(node => node.request === request);\n if (found) {\n found.isLongest = true;\n currentNodes = found.children;\n } else {\n console.error('Some request in the longest chain is not found');\n }\n }\n }\n\n return finalize({\n frameId: context.frameId,\n rootNodes,\n maxTime,\n relatedEvents,\n });\n}\n"]}
1
+ {"version":3,"file":"NetworkDependencyTree.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/NetworkDependencyTree.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright 2025 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 Protocol from '../../../generated/protocol.js';\nimport type * as Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport type * as Lantern from '../lantern/lantern.js';\nimport * as Types from '../types/types.js';\n\nimport {\n InsightCategory,\n InsightKeys,\n type InsightModel,\n type InsightSetContext,\n type InsightSetContextWithNavigation,\n type PartialInsightModel,\n type RelatedEventsMap,\n} from './types.js';\n\nexport const UIStrings = {\n /**\n * @description Title of an insight that recommends avoiding chaining critical requests.\n */\n title: 'Network dependency tree',\n /**\n * @description Description of an insight that recommends avoiding chaining critical requests.\n */\n description:\n '[Avoid chaining critical requests](https://developer.chrome.com/docs/lighthouse/performance/critical-request-chains) by reducing the length of chains, reducing the download size of resources, or deferring the download of unnecessary resources to improve page load.',\n /**\n * @description Description of the warning that recommends avoiding chaining critical requests.\n */\n warningDescription:\n 'Avoid chaining critical requests by reducing the length of chains, reducing the download size of resources, or deferring the download of unnecessary resources to improve page load.',\n /**\n * @description Text status indicating that there isn't long chaining critical network requests.\n */\n noNetworkDependencyTree: 'No rendering tasks impacted by network dependencies',\n /**\n * @description Text for the maximum critical path latency. This refers to the longest chain of network requests that\n * the browser must download before it can render the page.\n */\n maxCriticalPathLatency: 'Max critical path latency:'\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/NetworkDependencyTree.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\n// XHRs are fetched at High priority, but we exclude them, as they are unlikely to be critical\n// Images are also non-critical.\nconst nonCriticalResourceTypes = new Set<Protocol.Network.ResourceType>([\n Protocol.Network.ResourceType.Image,\n Protocol.Network.ResourceType.XHR,\n Protocol.Network.ResourceType.Fetch,\n Protocol.Network.ResourceType.EventSource,\n]);\n\nexport interface CriticalRequestNode {\n request: Types.Events.SyntheticNetworkRequest;\n timeFromInitialRequest: Types.Timing.Micro;\n children: CriticalRequestNode[];\n isLongest?: boolean;\n // Store all the requests that appear in any chains this request appears in.\n // Use set to avoid duplication.\n relatedRequests: Set<Types.Events.SyntheticNetworkRequest>;\n}\n\nexport type NetworkDependencyTreeInsightModel = InsightModel<typeof UIStrings, {\n rootNodes: CriticalRequestNode[],\n maxTime: Types.Timing.Micro,\n fail: boolean,\n}>;\n\nfunction finalize(partialModel: PartialInsightModel<NetworkDependencyTreeInsightModel>):\n NetworkDependencyTreeInsightModel {\n return {\n insightKey: InsightKeys.NETWORK_DEPENDENCY_TREE,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.LCP,\n state: partialModel.fail ? 'fail' : 'pass',\n ...partialModel,\n };\n}\n\nfunction isCritical(request: Types.Events.SyntheticNetworkRequest, context: InsightSetContextWithNavigation): boolean {\n // The main resource is always critical.\n if (request.args.data.requestId === context.navigationId) {\n return true;\n }\n\n // Treat any preloaded resource as non-critical\n if (request.args.data.isLinkPreload) {\n return false;\n }\n\n // Iframes are considered High Priority but they are not render blocking\n const isIframe = request.args.data.resourceType === Protocol.Network.ResourceType.Document &&\n request.args.data.frame !== context.frameId;\n\n if (nonCriticalResourceTypes.has(request.args.data.resourceType) || isIframe ||\n // Treat any missed images, primarily favicons, as non-critical resources\n request.args.data.mimeType.startsWith('image/')) {\n return false;\n }\n\n // Requests that have no initiatorRequest are typically ambiguous late-load assets.\n // Even on the off chance they were important, we don't have any parent to display for them.\n const initiatorUrl =\n request.args.data.initiator?.url || Helpers.Trace.getZeroIndexedStackTraceForEvent(request)?.at(0)?.url;\n if (!initiatorUrl) {\n return false;\n }\n\n const isBlocking = Helpers.Network.isSyntheticNetworkRequestEventRenderBlocking(request);\n const isHighPriority = Helpers.Network.isSyntheticNetworkRequestHighPriority(request);\n return isHighPriority || isBlocking;\n}\n\nexport function generateInsight(\n _parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): NetworkDependencyTreeInsightModel {\n if (!context.navigation) {\n return finalize({\n rootNodes: [],\n maxTime: Types.Timing.Micro(0),\n fail: false,\n });\n }\n\n const rootNodes: CriticalRequestNode[] = [];\n const relatedEvents: RelatedEventsMap = new Map();\n let maxTime = Types.Timing.Micro(0);\n let fail = false;\n\n let longestChain: Types.Events.SyntheticNetworkRequest[] = [];\n\n function addChain(path: Types.Events.SyntheticNetworkRequest[]): void {\n if (path.length === 0) {\n return;\n }\n if (path.length >= 2) {\n fail = true;\n }\n const initialRequest = path[0];\n const lastRequest = path[path.length - 1];\n const totalChainTime = Types.Timing.Micro(lastRequest.ts + lastRequest.dur - initialRequest.ts);\n if (totalChainTime > maxTime) {\n maxTime = totalChainTime;\n longestChain = path;\n }\n\n let currentNodes = rootNodes;\n\n for (let depth = 0; depth < path.length; ++depth) {\n const request = path[depth];\n // find the request\n let found = currentNodes.find(node => node.request === request);\n\n if (!found) {\n const timeFromInitialRequest = Types.Timing.Micro(request.ts + request.dur - initialRequest.ts);\n found = {\n request,\n timeFromInitialRequest,\n children: [],\n relatedRequests: new Set(),\n };\n currentNodes.push(found);\n }\n\n path.forEach(request => found?.relatedRequests.add(request));\n\n // TODO(b/372897712) Switch the UIString to markdown.\n relatedEvents.set(request, depth < 2 ? [] : [i18nString(UIStrings.warningDescription)]);\n\n currentNodes = found.children;\n }\n }\n // By default `traverse` will discover nodes in BFS-order regardless of dependencies, but\n // here we need traversal in a topological sort order. We'll visit a node only when its\n // dependencies have been met.\n const seenNodes = new Set<Lantern.Graph.Node<Types.Events.SyntheticNetworkRequest>>();\n function getNextNodes(node: Lantern.Graph.Node<Types.Events.SyntheticNetworkRequest>):\n Array<Lantern.Graph.Node<Types.Events.SyntheticNetworkRequest>> {\n return node.getDependents().filter(n => n.getDependencies().every(d => seenNodes.has(d)));\n }\n\n context.lantern?.graph.traverse((node, traversalPath) => {\n seenNodes.add(node);\n if (node.type !== 'network') {\n return;\n }\n const networkNode = node;\n if (!isCritical(networkNode.rawRequest, context)) {\n return;\n }\n\n const networkPath = traversalPath.filter(node => node.type === 'network').reverse().map(node => node.rawRequest);\n\n // Ignore if some ancestor is not a critical request.\n if (networkPath.some(request => (!isCritical(request, context)))) {\n return;\n }\n\n // Ignore non-network things (like data urls).\n if (node.isNonNetworkProtocol) {\n return;\n }\n\n addChain(networkPath);\n }, getNextNodes);\n\n // Mark the longest chain\n if (longestChain.length > 0) {\n let currentNodes = rootNodes;\n for (const request of longestChain) {\n const found = currentNodes.find(node => node.request === request);\n if (found) {\n found.isLongest = true;\n currentNodes = found.children;\n } else {\n console.error('Some request in the longest chain is not found');\n }\n }\n }\n\n return finalize({\n rootNodes,\n maxTime,\n fail,\n relatedEvents,\n });\n}\n"]}
@@ -77,7 +77,7 @@ function estimateSavingsWithGraphs(deferredIds, lanternContext) {
77
77
  return Math.round(Math.max(estimateBeforeInline - estimateAfterInline, 0));
78
78
  }
79
79
  function hasImageLCP(parsedTrace, context) {
80
- return parsedTrace.LargestImagePaint.lcpRequestByNavigation.get(context.navigation) !== undefined;
80
+ return parsedTrace.LargestImagePaint.lcpRequestByNavigationId.has(context.navigationId);
81
81
  }
82
82
  function computeSavings(parsedTrace, context, renderBlockingRequests) {
83
83
  if (!context.lantern) {
@@ -125,7 +125,6 @@ function finalize(partialModel) {
125
125
  export function generateInsight(parsedTrace, context) {
126
126
  if (!context.navigation) {
127
127
  return finalize({
128
- frameId: context.frameId,
129
128
  renderBlockingRequests: [],
130
129
  });
131
130
  }
@@ -135,7 +134,6 @@ export function generateInsight(parsedTrace, context) {
135
134
  ?.event?.ts;
136
135
  if (!firstPaintTs) {
137
136
  return finalize({
138
- frameId: context.frameId,
139
137
  renderBlockingRequests: [],
140
138
  warnings: [InsightWarning.NO_FP],
141
139
  });
@@ -176,7 +174,6 @@ export function generateInsight(parsedTrace, context) {
176
174
  return b.dur - a.dur;
177
175
  });
178
176
  return finalize({
179
- frameId: context.frameId,
180
177
  relatedEvents: renderBlockingRequests,
181
178
  renderBlockingRequests,
182
179
  ...savings,
@@ -1 +1 @@
1
- {"version":3,"file":"RenderBlocking.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/RenderBlocking.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 Protocol from '../../../generated/protocol.js';\nimport * as Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport type * as Lantern from '../lantern/lantern.js';\nimport type * as Types from '../types/types.js';\n\nimport {\n InsightCategory,\n InsightKeys,\n type InsightModel,\n type InsightSetContext,\n type InsightSetContextWithNavigation,\n InsightWarning,\n type LanternContext,\n type PartialInsightModel,\n} from './types.js';\n\nexport const UIStrings = {\n /**\n * @description Title of an insight that provides the user with the list of network requests that blocked and therefore slowed down the page rendering and becoming visible to the user.\n */\n title: 'Render blocking requests',\n /**\n * @description Text to describe that there are requests blocking rendering, which may affect LCP.\n */\n description: 'Requests are blocking the page\\'s initial render, which may delay LCP. ' +\n '[Deferring or inlining](https://web.dev/learn/performance/understanding-the-critical-path#render-blocking_resources/) ' +\n 'can move these network requests out of the critical path.',\n /**\n * @description Label to describe a network request (that happens to be render-blocking).\n */\n renderBlockingRequest: 'Request',\n /**\n *@description Label used for a time duration.\n */\n duration: 'Duration',\n /**\n * @description Text status indicating that no requests blocked the initial render of a navigation\n */\n noRenderBlocking: 'No render blocking requests for this navigation',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/RenderBlocking.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport function isRenderBlocking(insight: InsightModel): insight is RenderBlockingInsightModel {\n return insight.insightKey === 'RenderBlocking';\n}\n\nexport type RenderBlockingInsightModel = InsightModel<typeof UIStrings, {\n renderBlockingRequests: Types.Events.SyntheticNetworkRequest[],\n requestIdToWastedMs?: Map<string, number>,\n}>;\n\n// Because of the way we detect blocking stylesheets, asynchronously loaded\n// CSS with link[rel=preload] and an onload handler (see https://github.com/filamentgroup/loadCSS)\n// can be falsely flagged as blocking. Therefore, ignore stylesheets that loaded fast enough\n// to possibly be non-blocking (and they have minimal impact anyway).\nconst MINIMUM_WASTED_MS = 50;\n\n/**\n * Given a simulation's nodeTimings, return an object with the nodes/timing keyed by network URL\n */\nfunction getNodesAndTimingByRequestId(nodeTimings: Lantern.Simulation.Result['nodeTimings']):\n Map<string, {node: Lantern.Graph.Node, nodeTiming: Lantern.Types.Simulation.NodeTiming}> {\n const requestIdToNode =\n new Map<string, {node: Lantern.Graph.Node, nodeTiming: Lantern.Types.Simulation.NodeTiming}>();\n\n for (const [node, nodeTiming] of nodeTimings) {\n if (node.type !== 'network') {\n continue;\n }\n\n requestIdToNode.set(node.request.requestId, {node, nodeTiming});\n }\n\n return requestIdToNode;\n}\n\nfunction estimateSavingsWithGraphs(deferredIds: Set<string>, lanternContext: LanternContext): Types.Timing.Milli {\n const simulator = lanternContext.simulator;\n const fcpGraph = lanternContext.metrics.firstContentfulPaint.optimisticGraph;\n const {nodeTimings} = lanternContext.simulator.simulate(fcpGraph);\n const adjustedNodeTimings = new Map(nodeTimings);\n\n const totalChildNetworkBytes = 0;\n const minimalFCPGraph = fcpGraph.cloneWithRelationships(node => {\n // If a node can be deferred, exclude it from the new FCP graph\n const canDeferRequest = deferredIds.has(node.id);\n return !canDeferRequest;\n });\n\n if (minimalFCPGraph.type !== 'network') {\n throw new Error('minimalFCPGraph not a NetworkNode');\n }\n\n // Recalculate the \"before\" time based on our adjusted node timings.\n const estimateBeforeInline = Math.max(...Array.from(\n Array.from(adjustedNodeTimings).map(timing => timing[1].endTime),\n ));\n\n // Add the inlined bytes to the HTML response\n const originalTransferSize = minimalFCPGraph.request.transferSize;\n const safeTransferSize = originalTransferSize || 0;\n minimalFCPGraph.request.transferSize = safeTransferSize + totalChildNetworkBytes;\n const estimateAfterInline = simulator.simulate(minimalFCPGraph).timeInMs;\n minimalFCPGraph.request.transferSize = originalTransferSize;\n return Math.round(Math.max(estimateBeforeInline - estimateAfterInline, 0)) as Types.Timing.Milli;\n}\n\nfunction hasImageLCP(parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContextWithNavigation): boolean {\n return parsedTrace.LargestImagePaint.lcpRequestByNavigation.get(context.navigation) !== undefined;\n}\n\nfunction computeSavings(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContextWithNavigation,\n renderBlockingRequests: Types.Events.SyntheticNetworkRequest[]):\n Pick<RenderBlockingInsightModel, 'metricSavings'|'requestIdToWastedMs'>|undefined {\n if (!context.lantern) {\n return;\n }\n\n const nodesAndTimingsByRequestId =\n getNodesAndTimingByRequestId(context.lantern.metrics.firstContentfulPaint.optimisticEstimate.nodeTimings);\n\n const metricSavings = {FCP: 0 as Types.Timing.Milli, LCP: 0 as Types.Timing.Milli};\n const requestIdToWastedMs = new Map<string, number>();\n const deferredNodeIds = new Set<string>();\n for (const request of renderBlockingRequests) {\n const nodeAndTiming = nodesAndTimingsByRequestId.get(request.args.data.requestId);\n if (!nodeAndTiming) {\n continue;\n }\n\n const {node, nodeTiming} = nodeAndTiming;\n\n // Mark this node and all its dependents as deferrable\n node.traverse(node => deferredNodeIds.add(node.id));\n\n // \"wastedMs\" is the download time of the network request, responseReceived - requestSent\n const wastedMs = Math.round(nodeTiming.duration);\n if (wastedMs < MINIMUM_WASTED_MS) {\n continue;\n }\n\n requestIdToWastedMs.set(node.id, wastedMs);\n }\n\n if (requestIdToWastedMs.size) {\n metricSavings.FCP = estimateSavingsWithGraphs(deferredNodeIds, context.lantern);\n\n // In most cases, render blocking resources only affect LCP if LCP isn't an image.\n if (!hasImageLCP(parsedTrace, context)) {\n metricSavings.LCP = metricSavings.FCP;\n }\n }\n\n return {metricSavings, requestIdToWastedMs};\n}\n\nfunction finalize(partialModel: PartialInsightModel<RenderBlockingInsightModel>): RenderBlockingInsightModel {\n return {\n insightKey: InsightKeys.RENDER_BLOCKING,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.LCP,\n state: partialModel.renderBlockingRequests.length > 0 ? 'fail' : 'pass',\n ...partialModel,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): RenderBlockingInsightModel {\n if (!context.navigation) {\n return finalize({\n frameId: context.frameId,\n renderBlockingRequests: [],\n });\n }\n\n const firstPaintTs = parsedTrace.PageLoadMetrics.metricScoresByFrameId.get(context.frameId)\n ?.get(context.navigationId)\n ?.get(Handlers.ModelHandlers.PageLoadMetrics.MetricName.FP)\n ?.event?.ts;\n if (!firstPaintTs) {\n return finalize({\n frameId: context.frameId,\n renderBlockingRequests: [],\n warnings: [InsightWarning.NO_FP],\n });\n }\n\n let renderBlockingRequests: Types.Events.SyntheticNetworkRequest[] = [];\n for (const req of parsedTrace.NetworkRequests.byTime) {\n if (req.args.data.frame !== context.frameId) {\n continue;\n }\n\n if (!Helpers.Network.isSyntheticNetworkRequestEventRenderBlocking(req)) {\n continue;\n }\n\n if (req.args.data.syntheticData.finishTime > firstPaintTs) {\n continue;\n }\n\n // If a request is marked `in_body_parser_blocking` it should only be considered render blocking if it is a\n // high enough priority. Some requests (e.g. scripts) are not marked as high priority if they are fetched\n // after a non-preloaded image. (See \"early\" definition in https://web.dev/articles/fetch-priority)\n //\n // There are edge cases and exceptions (e.g. priority hints) but this gives us the best approximation\n // of render blocking resources in the document body.\n if (req.args.data.renderBlocking === 'in_body_parser_blocking') {\n const priority = req.args.data.priority;\n const isScript = req.args.data.resourceType === Protocol.Network.ResourceType.Script;\n const isBlockingScript = isScript && priority === Protocol.Network.ResourcePriority.High;\n if (priority !== Protocol.Network.ResourcePriority.VeryHigh && !isBlockingScript) {\n continue;\n }\n }\n\n const navigation =\n Helpers.Trace.getNavigationForTraceEvent(req, context.frameId, parsedTrace.Meta.navigationsByFrameId);\n if (navigation === context.navigation) {\n renderBlockingRequests.push(req);\n }\n }\n\n const savings = computeSavings(parsedTrace, context, renderBlockingRequests);\n\n // Sort by request duration for insights.\n renderBlockingRequests = renderBlockingRequests.sort((a, b) => {\n return b.dur - a.dur;\n });\n\n return finalize({\n frameId: context.frameId,\n relatedEvents: renderBlockingRequests,\n renderBlockingRequests,\n ...savings,\n });\n}\n"]}
1
+ {"version":3,"file":"RenderBlocking.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/RenderBlocking.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 Protocol from '../../../generated/protocol.js';\nimport * as Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport type * as Lantern from '../lantern/lantern.js';\nimport type * as Types from '../types/types.js';\n\nimport {\n InsightCategory,\n InsightKeys,\n type InsightModel,\n type InsightSetContext,\n type InsightSetContextWithNavigation,\n InsightWarning,\n type LanternContext,\n type PartialInsightModel,\n} from './types.js';\n\nexport const UIStrings = {\n /**\n * @description Title of an insight that provides the user with the list of network requests that blocked and therefore slowed down the page rendering and becoming visible to the user.\n */\n title: 'Render blocking requests',\n /**\n * @description Text to describe that there are requests blocking rendering, which may affect LCP.\n */\n description: 'Requests are blocking the page\\'s initial render, which may delay LCP. ' +\n '[Deferring or inlining](https://web.dev/learn/performance/understanding-the-critical-path#render-blocking_resources/) ' +\n 'can move these network requests out of the critical path.',\n /**\n * @description Label to describe a network request (that happens to be render-blocking).\n */\n renderBlockingRequest: 'Request',\n /**\n *@description Label used for a time duration.\n */\n duration: 'Duration',\n /**\n * @description Text status indicating that no requests blocked the initial render of a navigation\n */\n noRenderBlocking: 'No render blocking requests for this navigation',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/RenderBlocking.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport function isRenderBlocking(insight: InsightModel): insight is RenderBlockingInsightModel {\n return insight.insightKey === 'RenderBlocking';\n}\n\nexport type RenderBlockingInsightModel = InsightModel<typeof UIStrings, {\n renderBlockingRequests: Types.Events.SyntheticNetworkRequest[],\n requestIdToWastedMs?: Map<string, number>,\n}>;\n\n// Because of the way we detect blocking stylesheets, asynchronously loaded\n// CSS with link[rel=preload] and an onload handler (see https://github.com/filamentgroup/loadCSS)\n// can be falsely flagged as blocking. Therefore, ignore stylesheets that loaded fast enough\n// to possibly be non-blocking (and they have minimal impact anyway).\nconst MINIMUM_WASTED_MS = 50;\n\n/**\n * Given a simulation's nodeTimings, return an object with the nodes/timing keyed by network URL\n */\nfunction getNodesAndTimingByRequestId(nodeTimings: Lantern.Simulation.Result['nodeTimings']):\n Map<string, {node: Lantern.Graph.Node, nodeTiming: Lantern.Types.Simulation.NodeTiming}> {\n const requestIdToNode =\n new Map<string, {node: Lantern.Graph.Node, nodeTiming: Lantern.Types.Simulation.NodeTiming}>();\n\n for (const [node, nodeTiming] of nodeTimings) {\n if (node.type !== 'network') {\n continue;\n }\n\n requestIdToNode.set(node.request.requestId, {node, nodeTiming});\n }\n\n return requestIdToNode;\n}\n\nfunction estimateSavingsWithGraphs(deferredIds: Set<string>, lanternContext: LanternContext): Types.Timing.Milli {\n const simulator = lanternContext.simulator;\n const fcpGraph = lanternContext.metrics.firstContentfulPaint.optimisticGraph;\n const {nodeTimings} = lanternContext.simulator.simulate(fcpGraph);\n const adjustedNodeTimings = new Map(nodeTimings);\n\n const totalChildNetworkBytes = 0;\n const minimalFCPGraph = fcpGraph.cloneWithRelationships(node => {\n // If a node can be deferred, exclude it from the new FCP graph\n const canDeferRequest = deferredIds.has(node.id);\n return !canDeferRequest;\n });\n\n if (minimalFCPGraph.type !== 'network') {\n throw new Error('minimalFCPGraph not a NetworkNode');\n }\n\n // Recalculate the \"before\" time based on our adjusted node timings.\n const estimateBeforeInline = Math.max(...Array.from(\n Array.from(adjustedNodeTimings).map(timing => timing[1].endTime),\n ));\n\n // Add the inlined bytes to the HTML response\n const originalTransferSize = minimalFCPGraph.request.transferSize;\n const safeTransferSize = originalTransferSize || 0;\n minimalFCPGraph.request.transferSize = safeTransferSize + totalChildNetworkBytes;\n const estimateAfterInline = simulator.simulate(minimalFCPGraph).timeInMs;\n minimalFCPGraph.request.transferSize = originalTransferSize;\n return Math.round(Math.max(estimateBeforeInline - estimateAfterInline, 0)) as Types.Timing.Milli;\n}\n\nfunction hasImageLCP(parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContextWithNavigation): boolean {\n return parsedTrace.LargestImagePaint.lcpRequestByNavigationId.has(context.navigationId);\n}\n\nfunction computeSavings(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContextWithNavigation,\n renderBlockingRequests: Types.Events.SyntheticNetworkRequest[]):\n Pick<RenderBlockingInsightModel, 'metricSavings'|'requestIdToWastedMs'>|undefined {\n if (!context.lantern) {\n return;\n }\n\n const nodesAndTimingsByRequestId =\n getNodesAndTimingByRequestId(context.lantern.metrics.firstContentfulPaint.optimisticEstimate.nodeTimings);\n\n const metricSavings = {FCP: 0 as Types.Timing.Milli, LCP: 0 as Types.Timing.Milli};\n const requestIdToWastedMs = new Map<string, number>();\n const deferredNodeIds = new Set<string>();\n for (const request of renderBlockingRequests) {\n const nodeAndTiming = nodesAndTimingsByRequestId.get(request.args.data.requestId);\n if (!nodeAndTiming) {\n continue;\n }\n\n const {node, nodeTiming} = nodeAndTiming;\n\n // Mark this node and all its dependents as deferrable\n node.traverse(node => deferredNodeIds.add(node.id));\n\n // \"wastedMs\" is the download time of the network request, responseReceived - requestSent\n const wastedMs = Math.round(nodeTiming.duration);\n if (wastedMs < MINIMUM_WASTED_MS) {\n continue;\n }\n\n requestIdToWastedMs.set(node.id, wastedMs);\n }\n\n if (requestIdToWastedMs.size) {\n metricSavings.FCP = estimateSavingsWithGraphs(deferredNodeIds, context.lantern);\n\n // In most cases, render blocking resources only affect LCP if LCP isn't an image.\n if (!hasImageLCP(parsedTrace, context)) {\n metricSavings.LCP = metricSavings.FCP;\n }\n }\n\n return {metricSavings, requestIdToWastedMs};\n}\n\nfunction finalize(partialModel: PartialInsightModel<RenderBlockingInsightModel>): RenderBlockingInsightModel {\n return {\n insightKey: InsightKeys.RENDER_BLOCKING,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.LCP,\n state: partialModel.renderBlockingRequests.length > 0 ? 'fail' : 'pass',\n ...partialModel,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): RenderBlockingInsightModel {\n if (!context.navigation) {\n return finalize({\n renderBlockingRequests: [],\n });\n }\n\n const firstPaintTs = parsedTrace.PageLoadMetrics.metricScoresByFrameId.get(context.frameId)\n ?.get(context.navigationId)\n ?.get(Handlers.ModelHandlers.PageLoadMetrics.MetricName.FP)\n ?.event?.ts;\n if (!firstPaintTs) {\n return finalize({\n renderBlockingRequests: [],\n warnings: [InsightWarning.NO_FP],\n });\n }\n\n let renderBlockingRequests: Types.Events.SyntheticNetworkRequest[] = [];\n for (const req of parsedTrace.NetworkRequests.byTime) {\n if (req.args.data.frame !== context.frameId) {\n continue;\n }\n\n if (!Helpers.Network.isSyntheticNetworkRequestEventRenderBlocking(req)) {\n continue;\n }\n\n if (req.args.data.syntheticData.finishTime > firstPaintTs) {\n continue;\n }\n\n // If a request is marked `in_body_parser_blocking` it should only be considered render blocking if it is a\n // high enough priority. Some requests (e.g. scripts) are not marked as high priority if they are fetched\n // after a non-preloaded image. (See \"early\" definition in https://web.dev/articles/fetch-priority)\n //\n // There are edge cases and exceptions (e.g. priority hints) but this gives us the best approximation\n // of render blocking resources in the document body.\n if (req.args.data.renderBlocking === 'in_body_parser_blocking') {\n const priority = req.args.data.priority;\n const isScript = req.args.data.resourceType === Protocol.Network.ResourceType.Script;\n const isBlockingScript = isScript && priority === Protocol.Network.ResourcePriority.High;\n if (priority !== Protocol.Network.ResourcePriority.VeryHigh && !isBlockingScript) {\n continue;\n }\n }\n\n const navigation =\n Helpers.Trace.getNavigationForTraceEvent(req, context.frameId, parsedTrace.Meta.navigationsByFrameId);\n if (navigation === context.navigation) {\n renderBlockingRequests.push(req);\n }\n }\n\n const savings = computeSavings(parsedTrace, context, renderBlockingRequests);\n\n // Sort by request duration for insights.\n renderBlockingRequests = renderBlockingRequests.sort((a, b) => {\n return b.dur - a.dur;\n });\n\n return finalize({\n relatedEvents: renderBlockingRequests,\n renderBlockingRequests,\n ...savings,\n });\n}\n"]}
@@ -102,7 +102,6 @@ export function generateInsight(parsedTrace, context) {
102
102
  return b[SelectorTimingsKey.MatchAttempts] - a[SelectorTimingsKey.MatchAttempts];
103
103
  });
104
104
  return finalize({
105
- frameId: context.frameId,
106
105
  // TODO: should we identify UpdateLayout events as linked to this insight?
107
106
  relatedEvents: [],
108
107
  totalElapsedMs: Types.Timing.Milli(totalElapsedUs / 1000.0),
@@ -1 +1 @@
1
- {"version":3,"file":"SlowCSSSelector.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/SlowCSSSelector.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 type * as Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport {type SelectorTiming, SelectorTimingsKey} from '../types/TraceEvents.js';\nimport * as Types from '../types/types.js';\n\nimport {\n InsightCategory,\n InsightKeys,\n type InsightModel,\n type InsightSetContext,\n type PartialInsightModel,\n} from './types.js';\n\nexport const UIStrings = {\n /**\n *@description Title of an insight that provides details about slow CSS selectors.\n */\n title: 'CSS Selector costs',\n\n /**\n * @description Text to describe how to improve the performance of CSS selectors.\n */\n description:\n 'If Recalculate Style costs remain high, selector optimization can reduce them. [Optimize the selectors](https://developer.chrome.com/docs/devtools/performance/selector-stats) with both high elapsed time and high slow-path %. Simpler selectors, fewer selectors, a smaller DOM, and a shallower DOM will all reduce matching costs.',\n /**\n *@description Column name for count of elements that the engine attempted to match against a style rule\n */\n matchAttempts: 'Match attempts',\n /**\n *@description Column name for count of elements that matched a style rule\n */\n matchCount: 'Match count',\n /**\n *@description Column name for elapsed time spent computing a style rule\n */\n elapsed: 'Elapsed time',\n /**\n *@description Column name for the selectors that took the longest amount of time/effort.\n */\n topSelectors: 'Top selectors',\n /**\n *@description Column name for a total sum.\n */\n total: 'Total',\n /**\n * @description Text status indicating that no CSS selector data was found.\n */\n enableSelectorData:\n 'No CSS selector data was found. CSS selector stats need to be enabled in the performance panel settings.',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/SlowCSSSelector.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport type SlowCSSSelectorInsightModel = InsightModel<typeof UIStrings, {\n totalElapsedMs: Types.Timing.Milli,\n totalMatchAttempts: number,\n totalMatchCount: number,\n topElapsedMs: Types.Events.SelectorTiming[],\n topMatchAttempts: Types.Events.SelectorTiming[],\n}>;\n\nfunction aggregateSelectorStats(\n data: Map<Types.Events.UpdateLayoutTree, {\n timings: Types.Events.SelectorTiming[],\n }>,\n context: InsightSetContext): SelectorTiming[] {\n const selectorMap = new Map<String, SelectorTiming>();\n\n for (const [event, value] of data) {\n if (event.args.beginData?.frame !== context.frameId) {\n continue;\n }\n if (!Helpers.Timing.eventIsInBounds(event, context.bounds)) {\n continue;\n }\n for (const timing of value.timings) {\n const key = timing[SelectorTimingsKey.Selector] + '_' + timing[SelectorTimingsKey.StyleSheetId];\n const findTiming = selectorMap.get(key);\n if (findTiming !== undefined) {\n findTiming[SelectorTimingsKey.Elapsed] += timing[SelectorTimingsKey.Elapsed];\n findTiming[SelectorTimingsKey.FastRejectCount] += timing[SelectorTimingsKey.FastRejectCount];\n findTiming[SelectorTimingsKey.MatchAttempts] += timing[SelectorTimingsKey.MatchAttempts];\n findTiming[SelectorTimingsKey.MatchCount] += timing[SelectorTimingsKey.MatchCount];\n } else {\n selectorMap.set(key, {...timing});\n }\n }\n }\n\n return [...selectorMap.values()];\n}\n\nfunction finalize(partialModel: PartialInsightModel<SlowCSSSelectorInsightModel>): SlowCSSSelectorInsightModel {\n return {\n insightKey: InsightKeys.SLOW_CSS_SELECTOR,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.ALL,\n state: partialModel.topElapsedMs.length !== 0 && partialModel.topMatchAttempts.length !== 0 ? 'informative' :\n 'pass',\n ...partialModel,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): SlowCSSSelectorInsightModel {\n const selectorStatsData = parsedTrace.SelectorStats;\n\n if (!selectorStatsData) {\n throw new Error('no selector stats data');\n }\n\n const selectorTimings = aggregateSelectorStats(selectorStatsData.dataForUpdateLayoutEvent, context);\n\n let totalElapsedUs = 0;\n let totalMatchAttempts = 0;\n let totalMatchCount = 0;\n\n selectorTimings.map(timing => {\n totalElapsedUs += timing[SelectorTimingsKey.Elapsed];\n totalMatchAttempts += timing[SelectorTimingsKey.MatchAttempts];\n totalMatchCount += timing[SelectorTimingsKey.MatchCount];\n });\n\n // sort by elapsed time\n const sortByElapsedMs = [...selectorTimings].sort((a, b) => {\n return b[SelectorTimingsKey.Elapsed] - a[SelectorTimingsKey.Elapsed];\n });\n\n // sort by match attempts\n const sortByMatchAttempts = [...selectorTimings].sort((a, b) => {\n return b[SelectorTimingsKey.MatchAttempts] - a[SelectorTimingsKey.MatchAttempts];\n });\n\n return finalize({\n frameId: context.frameId,\n // TODO: should we identify UpdateLayout events as linked to this insight?\n relatedEvents: [],\n totalElapsedMs: Types.Timing.Milli(totalElapsedUs / 1000.0),\n totalMatchAttempts,\n totalMatchCount,\n topElapsedMs: sortByElapsedMs.slice(0, 3),\n topMatchAttempts: sortByMatchAttempts.slice(0, 3),\n });\n}\n"]}
1
+ {"version":3,"file":"SlowCSSSelector.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/SlowCSSSelector.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 type * as Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport {type SelectorTiming, SelectorTimingsKey} from '../types/TraceEvents.js';\nimport * as Types from '../types/types.js';\n\nimport {\n InsightCategory,\n InsightKeys,\n type InsightModel,\n type InsightSetContext,\n type PartialInsightModel,\n} from './types.js';\n\nexport const UIStrings = {\n /**\n *@description Title of an insight that provides details about slow CSS selectors.\n */\n title: 'CSS Selector costs',\n\n /**\n * @description Text to describe how to improve the performance of CSS selectors.\n */\n description:\n 'If Recalculate Style costs remain high, selector optimization can reduce them. [Optimize the selectors](https://developer.chrome.com/docs/devtools/performance/selector-stats) with both high elapsed time and high slow-path %. Simpler selectors, fewer selectors, a smaller DOM, and a shallower DOM will all reduce matching costs.',\n /**\n *@description Column name for count of elements that the engine attempted to match against a style rule\n */\n matchAttempts: 'Match attempts',\n /**\n *@description Column name for count of elements that matched a style rule\n */\n matchCount: 'Match count',\n /**\n *@description Column name for elapsed time spent computing a style rule\n */\n elapsed: 'Elapsed time',\n /**\n *@description Column name for the selectors that took the longest amount of time/effort.\n */\n topSelectors: 'Top selectors',\n /**\n *@description Column name for a total sum.\n */\n total: 'Total',\n /**\n * @description Text status indicating that no CSS selector data was found.\n */\n enableSelectorData:\n 'No CSS selector data was found. CSS selector stats need to be enabled in the performance panel settings.',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/SlowCSSSelector.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport type SlowCSSSelectorInsightModel = InsightModel<typeof UIStrings, {\n totalElapsedMs: Types.Timing.Milli,\n totalMatchAttempts: number,\n totalMatchCount: number,\n topElapsedMs: Types.Events.SelectorTiming[],\n topMatchAttempts: Types.Events.SelectorTiming[],\n}>;\n\nfunction aggregateSelectorStats(\n data: Map<Types.Events.UpdateLayoutTree, {\n timings: Types.Events.SelectorTiming[],\n }>,\n context: InsightSetContext): SelectorTiming[] {\n const selectorMap = new Map<String, SelectorTiming>();\n\n for (const [event, value] of data) {\n if (event.args.beginData?.frame !== context.frameId) {\n continue;\n }\n if (!Helpers.Timing.eventIsInBounds(event, context.bounds)) {\n continue;\n }\n for (const timing of value.timings) {\n const key = timing[SelectorTimingsKey.Selector] + '_' + timing[SelectorTimingsKey.StyleSheetId];\n const findTiming = selectorMap.get(key);\n if (findTiming !== undefined) {\n findTiming[SelectorTimingsKey.Elapsed] += timing[SelectorTimingsKey.Elapsed];\n findTiming[SelectorTimingsKey.FastRejectCount] += timing[SelectorTimingsKey.FastRejectCount];\n findTiming[SelectorTimingsKey.MatchAttempts] += timing[SelectorTimingsKey.MatchAttempts];\n findTiming[SelectorTimingsKey.MatchCount] += timing[SelectorTimingsKey.MatchCount];\n } else {\n selectorMap.set(key, {...timing});\n }\n }\n }\n\n return [...selectorMap.values()];\n}\n\nfunction finalize(partialModel: PartialInsightModel<SlowCSSSelectorInsightModel>): SlowCSSSelectorInsightModel {\n return {\n insightKey: InsightKeys.SLOW_CSS_SELECTOR,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.ALL,\n state: partialModel.topElapsedMs.length !== 0 && partialModel.topMatchAttempts.length !== 0 ? 'informative' :\n 'pass',\n ...partialModel,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): SlowCSSSelectorInsightModel {\n const selectorStatsData = parsedTrace.SelectorStats;\n\n if (!selectorStatsData) {\n throw new Error('no selector stats data');\n }\n\n const selectorTimings = aggregateSelectorStats(selectorStatsData.dataForUpdateLayoutEvent, context);\n\n let totalElapsedUs = 0;\n let totalMatchAttempts = 0;\n let totalMatchCount = 0;\n\n selectorTimings.map(timing => {\n totalElapsedUs += timing[SelectorTimingsKey.Elapsed];\n totalMatchAttempts += timing[SelectorTimingsKey.MatchAttempts];\n totalMatchCount += timing[SelectorTimingsKey.MatchCount];\n });\n\n // sort by elapsed time\n const sortByElapsedMs = [...selectorTimings].sort((a, b) => {\n return b[SelectorTimingsKey.Elapsed] - a[SelectorTimingsKey.Elapsed];\n });\n\n // sort by match attempts\n const sortByMatchAttempts = [...selectorTimings].sort((a, b) => {\n return b[SelectorTimingsKey.MatchAttempts] - a[SelectorTimingsKey.MatchAttempts];\n });\n\n return finalize({\n // TODO: should we identify UpdateLayout events as linked to this insight?\n relatedEvents: [],\n totalElapsedMs: Types.Timing.Milli(totalElapsedUs / 1000.0),\n totalMatchAttempts,\n totalMatchCount,\n topElapsedMs: sortByElapsedMs.slice(0, 3),\n topMatchAttempts: sortByMatchAttempts.slice(0, 3),\n });\n}\n"]}
@@ -12,3 +12,7 @@ export declare function getLogNormalScore({ median, p10 }: {
12
12
  median: number;
13
13
  p10: number;
14
14
  }, value: number): number;
15
+ /**
16
+ * Interpolates the y value at a point x on the line defined by (x0, y0) and (x1, y1)
17
+ */
18
+ export declare function linearInterpolation(x0: number, y0: number, x1: number, y1: number, x: number): number;
@@ -83,4 +83,11 @@ export function getLogNormalScore({ median, p10 }, value) {
83
83
  }
84
84
  return score;
85
85
  }
86
+ /**
87
+ * Interpolates the y value at a point x on the line defined by (x0, y0) and (x1, y1)
88
+ */
89
+ export function linearInterpolation(x0, y0, x1, y1, x) {
90
+ const slope = (y1 - y0) / (x1 - x0);
91
+ return y0 + (x - x0) * slope;
92
+ }
86
93
  //# sourceMappingURL=Statistics.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Statistics.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/Statistics.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\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"]}
1
+ {"version":3,"file":"Statistics.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/Statistics.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\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\n/**\n * Interpolates the y value at a point x on the line defined by (x0, y0) and (x1, y1)\n */\nexport function linearInterpolation(x0: number, y0: number, x1: number, y1: number, x: number): number {\n const slope = (y1 - y0) / (x1 - x0);\n return y0 + (x - x0) * slope;\n}\n"]}
@@ -66,7 +66,6 @@ export function generateInsight(parsedTrace, context) {
66
66
  const firstPartyEntity = ThirdPartyWeb.ThirdPartyWeb.getEntity(firstPartyUrl) ||
67
67
  Handlers.Helpers.makeUpEntity(thirdPartySummary.madeUpEntityCache, firstPartyUrl);
68
68
  return finalize({
69
- frameId: context.frameId,
70
69
  relatedEvents: getRelatedEvents(thirdPartySummary, firstPartyEntity),
71
70
  eventsByEntity: thirdPartySummary.eventsByEntity,
72
71
  summaryByEntity: thirdPartySummary.byEntity,
@@ -1 +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 * as Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport type * as Types from '../types/types.js';\n\nimport {\n InsightCategory,\n InsightKeys,\n type InsightModel,\n type InsightSetContext,\n type PartialInsightModel,\n} from './types.js';\n\nexport const 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: '3rd 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: '3rd party code can significantly impact load performance. ' +\n '[Reduce and defer loading of 3rd party code](https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/loading-third-party-javascript/) to prioritize your page\\'s content.',\n /** Label for a table column that displays the name of a third-party provider. */\n columnThirdParty: '3rd party',\n /** Label for a column in a data table; entries will be the download size of a web resource in kilobytes. */\n columnTransferSize: 'Transfer size',\n /** Label for a table column that displays how much time each row spent running on the main thread, entries will be the number of milliseconds spent. */\n columnMainThreadTime: 'Main thread time',\n /**\n * @description Text block indicating that no third party content was detected on the page\n */\n noThirdParties: 'No third parties found',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/ThirdParties.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport type ThirdPartiesInsightModel = InsightModel<typeof UIStrings, {\n eventsByEntity: Map<Extras.ThirdParties.Entity, Types.Events.Event[]>,\n summaryByEntity: Map<Extras.ThirdParties.Entity, Extras.ThirdParties.Summary>,\n summaryByUrl: Map<string, Extras.ThirdParties.Summary>,\n urlsByEntity: Map<Extras.ThirdParties.Entity, Set<string>>,\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.ThirdPartySummary,\n firstPartyEntity: Extras.ThirdParties.Entity|undefined): Types.Events.Event[] {\n const relatedEvents = [];\n\n for (const [entity, events] of summaries.eventsByEntity.entries()) {\n if (entity !== firstPartyEntity) {\n relatedEvents.push(...events);\n }\n }\n\n return relatedEvents;\n}\n\nfunction finalize(partialModel: PartialInsightModel<ThirdPartiesInsightModel>): ThirdPartiesInsightModel {\n return {\n insightKey: InsightKeys.THIRD_PARTIES,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.ALL,\n state: [...partialModel.summaryByEntity.entries()].find(kv => kv[0] !== partialModel.firstPartyEntity) ?\n 'informative' :\n 'pass',\n ...partialModel,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, 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 thirdPartySummary = Extras.ThirdParties.summarizeThirdParties(\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(thirdPartySummary.madeUpEntityCache, firstPartyUrl);\n\n return finalize({\n frameId: context.frameId,\n relatedEvents: getRelatedEvents(thirdPartySummary, firstPartyEntity),\n eventsByEntity: thirdPartySummary.eventsByEntity,\n summaryByEntity: thirdPartySummary.byEntity,\n summaryByUrl: thirdPartySummary.byUrl,\n urlsByEntity: thirdPartySummary.urlsByEntity,\n firstPartyEntity,\n });\n}\n"]}
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 * as Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport type * as Types from '../types/types.js';\n\nimport {\n InsightCategory,\n InsightKeys,\n type InsightModel,\n type InsightSetContext,\n type PartialInsightModel,\n} from './types.js';\n\nexport const 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: '3rd 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: '3rd party code can significantly impact load performance. ' +\n '[Reduce and defer loading of 3rd party code](https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/loading-third-party-javascript/) to prioritize your page\\'s content.',\n /** Label for a table column that displays the name of a third-party provider. */\n columnThirdParty: '3rd party',\n /** Label for a column in a data table; entries will be the download size of a web resource in kilobytes. */\n columnTransferSize: 'Transfer size',\n /** Label for a table column that displays how much time each row spent running on the main thread, entries will be the number of milliseconds spent. */\n columnMainThreadTime: 'Main thread time',\n /**\n * @description Text block indicating that no third party content was detected on the page\n */\n noThirdParties: 'No third parties found',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/ThirdParties.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport type ThirdPartiesInsightModel = InsightModel<typeof UIStrings, {\n eventsByEntity: Map<Extras.ThirdParties.Entity, Types.Events.Event[]>,\n summaryByEntity: Map<Extras.ThirdParties.Entity, Extras.ThirdParties.Summary>,\n summaryByUrl: Map<string, Extras.ThirdParties.Summary>,\n urlsByEntity: Map<Extras.ThirdParties.Entity, Set<string>>,\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.ThirdPartySummary,\n firstPartyEntity: Extras.ThirdParties.Entity|undefined): Types.Events.Event[] {\n const relatedEvents = [];\n\n for (const [entity, events] of summaries.eventsByEntity.entries()) {\n if (entity !== firstPartyEntity) {\n relatedEvents.push(...events);\n }\n }\n\n return relatedEvents;\n}\n\nfunction finalize(partialModel: PartialInsightModel<ThirdPartiesInsightModel>): ThirdPartiesInsightModel {\n return {\n insightKey: InsightKeys.THIRD_PARTIES,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.ALL,\n state: [...partialModel.summaryByEntity.entries()].find(kv => kv[0] !== partialModel.firstPartyEntity) ?\n 'informative' :\n 'pass',\n ...partialModel,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, 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 thirdPartySummary = Extras.ThirdParties.summarizeThirdParties(\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(thirdPartySummary.madeUpEntityCache, firstPartyUrl);\n\n return finalize({\n relatedEvents: getRelatedEvents(thirdPartySummary, firstPartyEntity),\n eventsByEntity: thirdPartySummary.eventsByEntity,\n summaryByEntity: thirdPartySummary.byEntity,\n summaryByUrl: thirdPartySummary.byUrl,\n urlsByEntity: thirdPartySummary.urlsByEntity,\n firstPartyEntity,\n });\n}\n"]}
@@ -0,0 +1,69 @@
1
+ import type * as Handlers from '../handlers/handlers.js';
2
+ import * as Helpers from '../helpers/helpers.js';
3
+ import type * as Types from '../types/types.js';
4
+ import { type InsightModel, type InsightSetContext } from './types.js';
5
+ export declare const UIStrings: {
6
+ /**
7
+ * @description Title of an insight that provides information and suggestions of resources that could improve their caching.
8
+ */
9
+ readonly title: "Use efficient cache lifetimes";
10
+ /**
11
+ * @description Text to tell the user about how caching can help improve performance.
12
+ */
13
+ readonly description: "A long cache lifetime can speed up repeat visits to your page. [Learn more](https://web.dev/uses-long-cache-ttl/).";
14
+ /**
15
+ * @description Column for a font loaded by the page to render text.
16
+ */
17
+ readonly requestColumn: "Request";
18
+ /**
19
+ * @description Column for a resource cache's Time To Live.
20
+ */
21
+ readonly cacheTTL: "Cache TTL";
22
+ /**
23
+ * @description Text describing that there were no requests found that need caching.
24
+ */
25
+ readonly noRequestsToCache: "No requests with inefficient cache policies";
26
+ /**
27
+ * @description Table row value representing the remaining items not shown in the table due to size constraints. This row will always represent at least 2 items.
28
+ * @example {5} PH1
29
+ */
30
+ readonly others: "{PH1} others";
31
+ };
32
+ export declare const i18nString: (id: string, values?: Record<string, string> | undefined) => Record<string, string>;
33
+ export type UseCacheInsightModel = InsightModel<typeof UIStrings, {
34
+ requests: Array<{
35
+ request: Types.Events.SyntheticNetworkRequest;
36
+ ttl: number;
37
+ wastedBytes: number;
38
+ }>;
39
+ totalWastedBytes: number;
40
+ }>;
41
+ /**
42
+ * Determines if a request is "cacheable".
43
+ * A request is "cacheable" if it is of the appropriate protocol and resource type
44
+ * (see Helpers.Network.NON_NETWORK_SCHEMES and Helpers.Network.STATIC_RESOURCE_TYPE)
45
+ * and has the appropriate statusCodes.
46
+ */
47
+ export declare function isCacheable(request: Types.Events.SyntheticNetworkRequest): boolean;
48
+ /**
49
+ * Returns max-age if defined, otherwise expires header if defined, and null if not.
50
+ */
51
+ export declare function computeCacheLifetimeInSeconds(headers: Array<{
52
+ name: string;
53
+ value: string;
54
+ }>, cacheControl: Helpers.Network.CacheControl | null): number | null;
55
+ export declare function getCombinedHeaders(responseHeaders: Array<{
56
+ name: string;
57
+ value: string;
58
+ }>): Map<string, string>;
59
+ /**
60
+ * Returns whether a request contains headers that disable caching.
61
+ * Disabled caching is checked on the 'cache-control' and 'pragma' headers.
62
+ */
63
+ export declare function cachingDisabled(headers: Map<string, string> | null, parsedCacheControl: Helpers.Network.CacheControl | null): boolean;
64
+ export interface CacheableRequest {
65
+ request: Types.Events.SyntheticNetworkRequest;
66
+ ttl: number;
67
+ wastedBytes: number;
68
+ }
69
+ export declare function generateInsight(parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): UseCacheInsightModel;