@paulirish/trace_engine 0.0.56 → 0.0.57

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 (183) hide show
  1. package/.tmp/tsbuildinfo/tsconfig.tsbuildinfo +1 -1
  2. package/README.md +2 -2
  3. package/generated/protocol.d.ts +51 -23
  4. package/locales/af.json +8 -8
  5. package/locales/am.json +8 -8
  6. package/locales/ar.json +8 -8
  7. package/locales/as.json +8 -8
  8. package/locales/az.json +8 -8
  9. package/locales/be.json +7 -7
  10. package/locales/bg.json +8 -8
  11. package/locales/bn.json +8 -8
  12. package/locales/bs.json +8 -8
  13. package/locales/ca.json +8 -8
  14. package/locales/cs.json +8 -8
  15. package/locales/cy.json +8 -8
  16. package/locales/da.json +8 -8
  17. package/locales/de.json +8 -8
  18. package/locales/el.json +8 -8
  19. package/locales/en-GB.json +8 -8
  20. package/locales/en-US.json +14 -5
  21. package/locales/en-XL.json +14 -5
  22. package/locales/es-419.json +8 -8
  23. package/locales/es.json +8 -8
  24. package/locales/et.json +8 -8
  25. package/locales/eu.json +8 -8
  26. package/locales/fa.json +11 -11
  27. package/locales/fi.json +8 -8
  28. package/locales/fil.json +8 -8
  29. package/locales/fr-CA.json +8 -8
  30. package/locales/fr.json +8 -8
  31. package/locales/gl.json +8 -8
  32. package/locales/gu.json +8 -8
  33. package/locales/he.json +8 -8
  34. package/locales/hi.json +8 -8
  35. package/locales/hr.json +8 -8
  36. package/locales/hu.json +8 -8
  37. package/locales/hy.json +8 -8
  38. package/locales/id.json +8 -8
  39. package/locales/is.json +8 -8
  40. package/locales/it.json +8 -8
  41. package/locales/ja.json +8 -8
  42. package/locales/ka.json +8 -8
  43. package/locales/kk.json +8 -8
  44. package/locales/km.json +8 -8
  45. package/locales/kn.json +7 -7
  46. package/locales/ko.json +8 -8
  47. package/locales/ky.json +7 -7
  48. package/locales/lo.json +8 -8
  49. package/locales/lt.json +8 -8
  50. package/locales/lv.json +8 -8
  51. package/locales/mk.json +8 -8
  52. package/locales/ml.json +8 -8
  53. package/locales/mn.json +8 -8
  54. package/locales/mr.json +7 -7
  55. package/locales/ms.json +7 -7
  56. package/locales/my.json +8 -8
  57. package/locales/ne.json +8 -8
  58. package/locales/nl.json +8 -8
  59. package/locales/no.json +8 -8
  60. package/locales/or.json +8 -8
  61. package/locales/pa.json +7 -7
  62. package/locales/pl.json +8 -8
  63. package/locales/pt-PT.json +8 -8
  64. package/locales/pt.json +8 -8
  65. package/locales/ro.json +8 -8
  66. package/locales/ru.json +8 -8
  67. package/locales/si.json +8 -8
  68. package/locales/sk.json +8 -8
  69. package/locales/sl.json +8 -8
  70. package/locales/sq.json +8 -8
  71. package/locales/sr-Latn.json +8 -8
  72. package/locales/sr.json +8 -8
  73. package/locales/sv.json +8 -8
  74. package/locales/sw.json +7 -7
  75. package/locales/ta.json +8 -8
  76. package/locales/te.json +8 -8
  77. package/locales/th.json +8 -8
  78. package/locales/tr.json +7 -7
  79. package/locales/uk.json +7 -7
  80. package/locales/ur.json +8 -8
  81. package/locales/uz.json +7 -7
  82. package/locales/vi.json +8 -8
  83. package/locales/zh-HK.json +8 -8
  84. package/locales/zh-TW.json +8 -8
  85. package/locales/zh.json +8 -8
  86. package/locales/zu.json +8 -8
  87. package/models/trace/ModelImpl.d.ts +1 -0
  88. package/models/trace/ModelImpl.js +2 -4
  89. package/models/trace/ModelImpl.js.map +1 -1
  90. package/models/trace/Processor.js +18 -12
  91. package/models/trace/Processor.js.map +1 -1
  92. package/models/trace/extras/TraceTree.d.ts +0 -1
  93. package/models/trace/extras/TraceTree.js +0 -3
  94. package/models/trace/extras/TraceTree.js.map +1 -1
  95. package/models/trace/handlers/ExtensionTraceDataHandler.js +28 -14
  96. package/models/trace/handlers/ExtensionTraceDataHandler.js.map +1 -1
  97. package/models/trace/handlers/NetworkRequestsHandler.js +9 -2
  98. package/models/trace/handlers/NetworkRequestsHandler.js.map +1 -1
  99. package/models/trace/handlers/SamplesHandler.js +2 -6
  100. package/models/trace/handlers/SamplesHandler.js.map +1 -1
  101. package/models/trace/handlers/SelectorStatsHandler.d.ts +17 -0
  102. package/models/trace/handlers/SelectorStatsHandler.js +42 -0
  103. package/models/trace/handlers/SelectorStatsHandler.js.map +1 -1
  104. package/models/trace/helpers/SamplesIntegrator.js +14 -22
  105. package/models/trace/helpers/SamplesIntegrator.js.map +1 -1
  106. package/models/trace/helpers/SyntheticEvents.d.ts +0 -6
  107. package/models/trace/helpers/SyntheticEvents.js +2 -2
  108. package/models/trace/helpers/SyntheticEvents.js.map +1 -1
  109. package/models/trace/helpers/Timing.d.ts +5 -0
  110. package/models/trace/helpers/Timing.js +53 -3
  111. package/models/trace/helpers/Timing.js.map +1 -1
  112. package/models/trace/insights/CLSCulprits.d.ts +1 -0
  113. package/models/trace/insights/CLSCulprits.js +22 -0
  114. package/models/trace/insights/CLSCulprits.js.map +1 -1
  115. package/models/trace/insights/Cache.d.ts +2 -0
  116. package/models/trace/insights/Cache.js +10 -0
  117. package/models/trace/insights/Cache.js.map +1 -1
  118. package/models/trace/insights/DOMSize.d.ts +1 -0
  119. package/models/trace/insights/DOMSize.js +8 -0
  120. package/models/trace/insights/DOMSize.js.map +1 -1
  121. package/models/trace/insights/DocumentLatency.d.ts +1 -0
  122. package/models/trace/insights/DocumentLatency.js +42 -0
  123. package/models/trace/insights/DocumentLatency.js.map +1 -1
  124. package/models/trace/insights/DuplicatedJavaScript.d.ts +2 -0
  125. package/models/trace/insights/DuplicatedJavaScript.js +9 -0
  126. package/models/trace/insights/DuplicatedJavaScript.js.map +1 -1
  127. package/models/trace/insights/FontDisplay.d.ts +1 -0
  128. package/models/trace/insights/FontDisplay.js +7 -0
  129. package/models/trace/insights/FontDisplay.js.map +1 -1
  130. package/models/trace/insights/ForcedReflow.d.ts +2 -0
  131. package/models/trace/insights/ForcedReflow.js +17 -0
  132. package/models/trace/insights/ForcedReflow.js.map +1 -1
  133. package/models/trace/insights/INPBreakdown.d.ts +6 -0
  134. package/models/trace/insights/INPBreakdown.js +31 -0
  135. package/models/trace/insights/INPBreakdown.js.map +1 -1
  136. package/models/trace/insights/ImageDelivery.d.ts +2 -0
  137. package/models/trace/insights/ImageDelivery.js +10 -0
  138. package/models/trace/insights/ImageDelivery.js.map +1 -1
  139. package/models/trace/insights/LCPBreakdown.d.ts +1 -0
  140. package/models/trace/insights/LCPBreakdown.js +23 -4
  141. package/models/trace/insights/LCPBreakdown.js.map +1 -1
  142. package/models/trace/insights/LCPDiscovery.d.ts +12 -0
  143. package/models/trace/insights/LCPDiscovery.js +58 -0
  144. package/models/trace/insights/LCPDiscovery.js.map +1 -1
  145. package/models/trace/insights/LegacyJavaScript.d.ts +2 -0
  146. package/models/trace/insights/LegacyJavaScript.js +9 -0
  147. package/models/trace/insights/LegacyJavaScript.js.map +1 -1
  148. package/models/trace/insights/ModernHTTP.d.ts +8 -5
  149. package/models/trace/insights/ModernHTTP.js +26 -13
  150. package/models/trace/insights/ModernHTTP.js.map +1 -1
  151. package/models/trace/insights/NetworkDependencyTree.d.ts +1 -0
  152. package/models/trace/insights/NetworkDependencyTree.js +25 -1
  153. package/models/trace/insights/NetworkDependencyTree.js.map +1 -1
  154. package/models/trace/insights/RenderBlocking.d.ts +2 -0
  155. package/models/trace/insights/RenderBlocking.js +10 -0
  156. package/models/trace/insights/RenderBlocking.js.map +1 -1
  157. package/models/trace/insights/SlowCSSSelector.d.ts +11 -2
  158. package/models/trace/insights/SlowCSSSelector.js +33 -14
  159. package/models/trace/insights/SlowCSSSelector.js.map +1 -1
  160. package/models/trace/insights/ThirdParties.d.ts +3 -0
  161. package/models/trace/insights/ThirdParties.js +31 -0
  162. package/models/trace/insights/ThirdParties.js.map +1 -1
  163. package/models/trace/insights/Viewport.d.ts +2 -1
  164. package/models/trace/insights/Viewport.js +16 -0
  165. package/models/trace/insights/Viewport.js.map +1 -1
  166. package/models/trace/insights/types.d.ts +4 -1
  167. package/models/trace/insights/types.js +1 -0
  168. package/models/trace/insights/types.js.map +1 -1
  169. package/models/trace/types/Extensions.d.ts +13 -1
  170. package/models/trace/types/Extensions.js +5 -1
  171. package/models/trace/types/Extensions.js.map +1 -1
  172. package/models/trace/types/Overlays.d.ts +110 -0
  173. package/models/trace/types/Overlays.js +5 -0
  174. package/models/trace/types/Overlays.js.map +1 -0
  175. package/models/trace/types/TraceEvents.d.ts +27 -9
  176. package/models/trace/types/TraceEvents.js +7 -18
  177. package/models/trace/types/TraceEvents.js.map +1 -1
  178. package/models/trace/types/types-tsconfig.json +1 -0
  179. package/models/trace/types/types.d.ts +1 -0
  180. package/models/trace/types/types.js +1 -0
  181. package/models/trace/types/types.js.map +1 -1
  182. package/package.json +1 -1
  183. package/test/test-trace-engine.mjs +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"CLSCulprits.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/CLSCulprits.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 Platform from '../../../core/platform/platform.js';\nimport type * as Protocol from '../../../generated/protocol.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 type PartialInsightModel,\n} from './types.js';\n\nexport const UIStrings = {\n /** Title of an insight that provides details about why elements shift/move on the page. The causes for these shifts are referred to as culprits (\"reasons\"). */\n title: 'Layout shift culprits',\n /**\n * @description Description of a DevTools insight that identifies the reasons that elements shift on the page.\n * This is displayed after a user expands the section to see more. No character length limits.\n */\n description:\n 'Layout shifts occur when elements move absent any user interaction. [Investigate the causes of layout shifts](https://web.dev/articles/optimize-cls), such as elements being added, removed, or their fonts changing as the page loads.',\n /**\n *@description Text indicating the worst layout shift cluster.\n */\n worstLayoutShiftCluster: 'Worst layout shift cluster',\n /**\n * @description Text indicating the worst layout shift cluster.\n */\n worstCluster: 'Worst cluster',\n /**\n * @description Text indicating a layout shift cluster and its start time.\n * @example {32 ms} PH1\n */\n layoutShiftCluster: 'Layout shift cluster @ {PH1}',\n /**\n *@description Text indicating the biggest reasons for the layout shifts.\n */\n topCulprits: 'Top layout shift culprits',\n /**\n * @description Text for a culprit type of Injected iframe.\n */\n injectedIframe: 'Injected iframe',\n /**\n * @description Text for a culprit type of web font request.\n */\n webFont: 'Web font',\n /**\n * @description Text for a culprit type of Animation.\n */\n animation: 'Animation',\n /**\n * @description Text for a culprit type of Unsized image.\n */\n unsizedImage: 'Unsized image element',\n /**\n * @description Text status when there were no layout shifts detected.\n */\n noLayoutShifts: 'No layout shifts',\n /**\n * @description Text status when there no layout shifts culprits/root causes were found.\n */\n noCulprits: 'Could not detect any layout shift culprits',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/CLSCulprits.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport type CLSCulpritsInsightModel = InsightModel<typeof UIStrings, {\n animationFailures: readonly NoncompositedAnimationFailure[],\n shifts: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>,\n clusters: Types.Events.SyntheticLayoutShiftCluster[],\n worstCluster: Types.Events.SyntheticLayoutShiftCluster | undefined,\n /** The top 3 shift root causes for each cluster. */\n topCulpritsByCluster: Map<Types.Events.SyntheticLayoutShiftCluster, LayoutShiftItem[]>,\n}>;\n\nexport enum AnimationFailureReasons {\n ACCELERATED_ANIMATIONS_DISABLED = 'ACCELERATED_ANIMATIONS_DISABLED',\n EFFECT_SUPPRESSED_BY_DEVTOOLS = 'EFFECT_SUPPRESSED_BY_DEVTOOLS',\n INVALID_ANIMATION_OR_EFFECT = 'INVALID_ANIMATION_OR_EFFECT',\n EFFECT_HAS_UNSUPPORTED_TIMING_PARAMS = 'EFFECT_HAS_UNSUPPORTED_TIMING_PARAMS',\n EFFECT_HAS_NON_REPLACE_COMPOSITE_MODE = 'EFFECT_HAS_NON_REPLACE_COMPOSITE_MODE',\n TARGET_HAS_INVALID_COMPOSITING_STATE = 'TARGET_HAS_INVALID_COMPOSITING_STATE',\n TARGET_HAS_INCOMPATIBLE_ANIMATIONS = 'TARGET_HAS_INCOMPATIBLE_ANIMATIONS',\n TARGET_HAS_CSS_OFFSET = 'TARGET_HAS_CSS_OFFSET',\n ANIMATION_AFFECTS_NON_CSS_PROPERTIES = 'ANIMATION_AFFECTS_NON_CSS_PROPERTIES',\n TRANSFORM_RELATED_PROPERTY_CANNOT_BE_ACCELERATED_ON_TARGET =\n 'TRANSFORM_RELATED_PROPERTY_CANNOT_BE_ACCELERATED_ON_TARGET',\n TRANSFROM_BOX_SIZE_DEPENDENT = 'TRANSFROM_BOX_SIZE_DEPENDENT',\n FILTER_RELATED_PROPERTY_MAY_MOVE_PIXELS = 'FILTER_RELATED_PROPERTY_MAY_MOVE_PIXELS',\n UNSUPPORTED_CSS_PROPERTY = 'UNSUPPORTED_CSS_PROPERTY',\n MIXED_KEYFRAME_VALUE_TYPES = 'MIXED_KEYFRAME_VALUE_TYPES',\n TIMELINE_SOURCE_HAS_INVALID_COMPOSITING_STATE = 'TIMELINE_SOURCE_HAS_INVALID_COMPOSITING_STATE',\n ANIMATION_HAS_NO_VISIBLE_CHANGE = 'ANIMATION_HAS_NO_VISIBLE_CHANGE',\n AFFECTS_IMPORTANT_PROPERTY = 'AFFECTS_IMPORTANT_PROPERTY',\n SVG_TARGET_HAS_INDEPENDENT_TRANSFORM_PROPERTY = 'SVG_TARGET_HAS_INDEPENDENT_TRANSFORM_PROPERTY',\n}\n\nexport enum LayoutShiftType {\n WEB_FONT = 0,\n IFRAMES = 1,\n ANIMATIONS = 2,\n UNSIZED_IMAGE = 3,\n}\n\nexport type LayoutShiftItem = {\n type: LayoutShiftType.UNSIZED_IMAGE,\n description: Platform.UIString.LocalizedString,\n url: string,\n backendNodeId: Protocol.DOM.BackendNodeId,\n frame: string,\n}|{\n type: Exclude<LayoutShiftType, LayoutShiftType.UNSIZED_IMAGE>,\n description: Platform.UIString.LocalizedString,\n};\n\nexport interface NoncompositedAnimationFailure {\n /**\n * Animation name.\n */\n name?: string;\n /**\n * Failure reason based on mask number defined in\n * https://source.chromium.org/search?q=f:compositor_animations.h%20%22enum%20FailureReason%22.\n */\n failureReasons: AnimationFailureReasons[];\n /**\n * Unsupported properties.\n */\n unsupportedProperties?: Types.Events.Animation['args']['data']['unsupportedProperties'];\n /**\n * Animation event.\n */\n animation?: Types.Events.SyntheticAnimationPair;\n}\n\n/**\n * Each failure reason is represented by a bit flag. The bit shift operator '<<' is used to define\n * which bit corresponds to each failure reason.\n * https://source.chromium.org/search?q=f:compositor_animations.h%20%22enum%20FailureReason%22\n */\nconst ACTIONABLE_FAILURE_REASONS: Array<{\n flag: number,\n failure: AnimationFailureReasons,\n}> =\n [\n {\n flag: 1 << 0,\n failure: AnimationFailureReasons.ACCELERATED_ANIMATIONS_DISABLED,\n },\n {\n flag: 1 << 1,\n failure: AnimationFailureReasons.EFFECT_SUPPRESSED_BY_DEVTOOLS,\n },\n {\n flag: 1 << 2,\n failure: AnimationFailureReasons.INVALID_ANIMATION_OR_EFFECT,\n },\n {\n flag: 1 << 3,\n failure: AnimationFailureReasons.EFFECT_HAS_UNSUPPORTED_TIMING_PARAMS,\n },\n {\n flag: 1 << 4,\n failure: AnimationFailureReasons.EFFECT_HAS_NON_REPLACE_COMPOSITE_MODE,\n },\n {\n flag: 1 << 5,\n failure: AnimationFailureReasons.TARGET_HAS_INVALID_COMPOSITING_STATE,\n },\n {\n flag: 1 << 6,\n failure: AnimationFailureReasons.TARGET_HAS_INCOMPATIBLE_ANIMATIONS,\n },\n {\n flag: 1 << 7,\n failure: AnimationFailureReasons.TARGET_HAS_CSS_OFFSET,\n },\n // The failure 1 << 8 is marked as obsolete in Blink\n {\n flag: 1 << 9,\n failure: AnimationFailureReasons.ANIMATION_AFFECTS_NON_CSS_PROPERTIES,\n },\n {\n flag: 1 << 10,\n failure: AnimationFailureReasons.TRANSFORM_RELATED_PROPERTY_CANNOT_BE_ACCELERATED_ON_TARGET,\n },\n {\n flag: 1 << 11,\n failure: AnimationFailureReasons.TRANSFROM_BOX_SIZE_DEPENDENT,\n },\n {\n flag: 1 << 12,\n failure: AnimationFailureReasons.FILTER_RELATED_PROPERTY_MAY_MOVE_PIXELS,\n },\n {\n flag: 1 << 13,\n failure: AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY,\n },\n // The failure 1 << 14 is marked as obsolete in Blink\n {\n flag: 1 << 15,\n failure: AnimationFailureReasons.MIXED_KEYFRAME_VALUE_TYPES,\n },\n {\n flag: 1 << 16,\n failure: AnimationFailureReasons.TIMELINE_SOURCE_HAS_INVALID_COMPOSITING_STATE,\n },\n {\n flag: 1 << 17,\n failure: AnimationFailureReasons.ANIMATION_HAS_NO_VISIBLE_CHANGE,\n },\n {\n flag: 1 << 18,\n failure: AnimationFailureReasons.AFFECTS_IMPORTANT_PROPERTY,\n },\n {\n flag: 1 << 19,\n failure: AnimationFailureReasons.SVG_TARGET_HAS_INDEPENDENT_TRANSFORM_PROPERTY,\n },\n ] as const;\n\n// 500ms window.\n// Use this window to consider events and requests that may have caused a layout shift.\nconst ROOT_CAUSE_WINDOW = Helpers.Timing.secondsToMicro(Types.Timing.Seconds(0.5));\n\nexport interface UnsizedImage {\n backendNodeId: Protocol.DOM.BackendNodeId;\n paintImageEvent: Types.Events.PaintImage;\n}\n\nexport interface IframeRootCause {\n frame: string;\n url?: string;\n}\n\nexport interface LayoutShiftRootCausesData {\n iframes: IframeRootCause[];\n webFonts: Types.Events.SyntheticNetworkRequest[];\n nonCompositedAnimations: NoncompositedAnimationFailure[];\n unsizedImages: UnsizedImage[];\n}\n\n/**\n * Returns if an event happens within the root cause window, before the target event.\n * ROOT_CAUSE_WINDOW v target event\n * |------------------------|=======================\n */\nfunction isInRootCauseWindow(event: Types.Events.Event, targetEvent: Types.Events.Event): boolean {\n const eventEnd = event.dur ? event.ts + event.dur : event.ts;\n return eventEnd < targetEvent.ts && eventEnd >= targetEvent.ts - ROOT_CAUSE_WINDOW;\n}\n\nexport function getNonCompositedFailure(animationEvent: Types.Events.SyntheticAnimationPair):\n NoncompositedAnimationFailure[] {\n const failures: NoncompositedAnimationFailure[] = [];\n const beginEvent = animationEvent.args.data.beginEvent;\n const instantEvents = animationEvent.args.data.instantEvents || [];\n /**\n * Animation events containing composite information are ASYNC_NESTABLE_INSTANT ('n').\n * An animation may also contain multiple 'n' events, so we look through those with useful non-composited data.\n */\n for (const event of instantEvents) {\n const failureMask = event.args.data.compositeFailed;\n const unsupportedProperties = event.args.data.unsupportedProperties;\n if (!failureMask) {\n continue;\n }\n const failureReasons =\n ACTIONABLE_FAILURE_REASONS.filter(reason => failureMask & reason.flag).map(reason => reason.failure);\n const failure: NoncompositedAnimationFailure = {\n name: beginEvent.args.data.displayName,\n failureReasons,\n unsupportedProperties,\n animation: animationEvent,\n };\n failures.push(failure);\n }\n return failures;\n}\n\nfunction getNonCompositedFailureRootCauses(\n animationEvents: Types.Events.SyntheticAnimationPair[],\n prePaintEvents: Types.Events.PrePaint[],\n shiftsByPrePaint: Map<Types.Events.PrePaint, Types.Events.SyntheticLayoutShift[]>,\n rootCausesByShift: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>,\n ): NoncompositedAnimationFailure[] {\n const allAnimationFailures: NoncompositedAnimationFailure[] = [];\n for (const animation of animationEvents) {\n /**\n * Animation events containing composite information are ASYNC_NESTABLE_INSTANT ('n').\n * An animation may also contain multiple 'n' events, so we look through those with useful non-composited data.\n */\n const failures = getNonCompositedFailure(animation);\n if (!failures) {\n continue;\n }\n allAnimationFailures.push(...failures);\n\n const nextPrePaint = getNextEvent(prePaintEvents, animation) as Types.Events.PrePaint | null;\n // If no following prePaint, this is not a root cause.\n if (!nextPrePaint) {\n continue;\n }\n\n // If the animation event is outside the ROOT_CAUSE_WINDOW, it could not be a root cause.\n if (!isInRootCauseWindow(animation, nextPrePaint)) {\n continue;\n }\n\n const shifts = shiftsByPrePaint.get(nextPrePaint);\n // if no layout shift(s), this is not a root cause.\n if (!shifts) {\n continue;\n }\n\n for (const shift of shifts) {\n const rootCausesForShift = rootCausesByShift.get(shift);\n if (!rootCausesForShift) {\n throw new Error('Unaccounted shift');\n }\n rootCausesForShift.nonCompositedAnimations.push(...failures);\n }\n }\n\n return allAnimationFailures;\n}\n\n/**\n * Given an array of layout shift and PrePaint events, returns a mapping from\n * PrePaint events to layout shifts dispatched within it.\n */\nfunction getShiftsByPrePaintEvents(\n layoutShifts: Types.Events.SyntheticLayoutShift[],\n prePaintEvents: Types.Events.PrePaint[],\n ): Map<Types.Events.PrePaint, Types.Events.SyntheticLayoutShift[]> {\n // Maps from PrePaint events to LayoutShifts that occurred in each one.\n const shiftsByPrePaint = new Map<Types.Events.PrePaint, Types.Events.SyntheticLayoutShift[]>();\n\n // Associate all shifts to their corresponding PrePaint.\n for (const prePaintEvent of prePaintEvents) {\n const firstShiftIndex =\n Platform.ArrayUtilities.nearestIndexFromBeginning(layoutShifts, shift => shift.ts >= prePaintEvent.ts);\n if (firstShiftIndex === null) {\n // No layout shifts registered after this PrePaint start. Continue.\n continue;\n }\n for (let i = firstShiftIndex; i < layoutShifts.length; i++) {\n const shift = layoutShifts[i];\n if (shift.ts >= prePaintEvent.ts && shift.ts <= prePaintEvent.ts + prePaintEvent.dur) {\n const shiftsInPrePaint = Platform.MapUtilities.getWithDefault(shiftsByPrePaint, prePaintEvent, () => []);\n shiftsInPrePaint.push(shift);\n }\n if (shift.ts > prePaintEvent.ts + prePaintEvent.dur) {\n // Reached all layoutShifts of this PrePaint. Break out to continue with the next prePaint event.\n break;\n }\n }\n }\n return shiftsByPrePaint;\n}\n\n/**\n * Given a source event list, this returns the first event of that list that directly follows the target event.\n */\nfunction getNextEvent(sourceEvents: Types.Events.Event[], targetEvent: Types.Events.Event): Types.Events.Event|\n undefined {\n const index = Platform.ArrayUtilities.nearestIndexFromBeginning(\n sourceEvents, source => source.ts > targetEvent.ts + (targetEvent.dur || 0));\n // No PrePaint event registered after this event\n if (index === null) {\n return undefined;\n }\n\n return sourceEvents[index];\n}\n\n/**\n * An Iframe is considered a root cause if the iframe event occurs before a prePaint event\n * and within this prePaint event a layout shift(s) occurs.\n */\nfunction getIframeRootCauses(\n parsedTrace: Handlers.Types.ParsedTrace,\n iframeCreatedEvents: readonly Types.Events.RenderFrameImplCreateChildFrame[],\n prePaintEvents: Types.Events.PrePaint[],\n shiftsByPrePaint: Map<Types.Events.PrePaint, Types.Events.SyntheticLayoutShift[]>,\n rootCausesByShift: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>,\n domLoadingEvents: readonly Types.Events.DomLoading[]):\n Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData> {\n for (const iframeEvent of iframeCreatedEvents) {\n const nextPrePaint = getNextEvent(prePaintEvents, iframeEvent) as Types.Events.PrePaint | null;\n // If no following prePaint, this is not a root cause.\n if (!nextPrePaint) {\n continue;\n }\n const shifts = shiftsByPrePaint.get(nextPrePaint);\n // if no layout shift(s), this is not a root cause.\n if (!shifts) {\n continue;\n }\n for (const shift of shifts) {\n const rootCausesForShift = rootCausesByShift.get(shift);\n if (!rootCausesForShift) {\n throw new Error('Unaccounted shift');\n }\n\n // Look for the first dom event that occurs within the bounds of the iframe event.\n // This contains the frame id.\n const domEvent = domLoadingEvents.find(e => {\n const maxIframe = Types.Timing.Micro(iframeEvent.ts + (iframeEvent.dur ?? 0));\n return e.ts >= iframeEvent.ts && e.ts <= maxIframe;\n });\n if (domEvent?.args.frame) {\n const frame = domEvent.args.frame;\n\n let url;\n const processes = parsedTrace.Meta.rendererProcessesByFrame.get(frame);\n if (processes && processes.size > 0) {\n url = [...processes.values()][0]?.[0].frame.url;\n }\n\n rootCausesForShift.iframes.push({frame, url});\n }\n }\n }\n return rootCausesByShift;\n}\n\n/**\n * An unsized image is considered a root cause if its PaintImage can be correlated to a\n * layout shift. We can correlate PaintImages with unsized images by their matching nodeIds.\n * X <- layout shift\n * |----------------|\n * ^ PrePaint event |-----|\n * ^ PaintImage\n */\nfunction getUnsizedImageRootCauses(\n unsizedImageEvents: readonly Types.Events.LayoutImageUnsized[], paintImageEvents: Types.Events.PaintImage[],\n shiftsByPrePaint: Map<Types.Events.PrePaint, Types.Events.SyntheticLayoutShift[]>,\n rootCausesByShift: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>):\n Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData> {\n shiftsByPrePaint.forEach((shifts, prePaint) => {\n const paintImage = getNextEvent(paintImageEvents, prePaint) as Types.Events.PaintImage | null;\n if (!paintImage) {\n return;\n }\n // The unsized image corresponds to this PaintImage.\n const matchingNode =\n unsizedImageEvents.find(unsizedImage => unsizedImage.args.data.nodeId === paintImage.args.data.nodeId);\n if (!matchingNode) {\n return;\n }\n // The unsized image is a potential root cause of all the shifts of this prePaint.\n for (const shift of shifts) {\n const rootCausesForShift = rootCausesByShift.get(shift);\n if (!rootCausesForShift) {\n throw new Error('Unaccounted shift');\n }\n rootCausesForShift.unsizedImages.push({\n backendNodeId: matchingNode.args.data.nodeId,\n paintImageEvent: paintImage,\n });\n }\n });\n return rootCausesByShift;\n}\n\nexport function isCLSCulprits(insight: InsightModel): insight is CLSCulpritsInsightModel {\n return insight.insightKey === InsightKeys.CLS_CULPRITS;\n}\n\n/**\n * A font request is considered a root cause if the request occurs before a prePaint event\n * and within this prePaint event a layout shift(s) occurs. Additionally, this font request should\n * happen within the ROOT_CAUSE_WINDOW of the prePaint event.\n */\nfunction getFontRootCauses(\n networkRequests: Types.Events.SyntheticNetworkRequest[], prePaintEvents: Types.Events.PrePaint[],\n shiftsByPrePaint: Map<Types.Events.PrePaint, Types.Events.SyntheticLayoutShift[]>,\n rootCausesByShift: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>):\n Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData> {\n const fontRequests =\n networkRequests.filter(req => req.args.data.resourceType === 'Font' && req.args.data.mimeType.startsWith('font'));\n\n for (const req of fontRequests) {\n const nextPrePaint = getNextEvent(prePaintEvents, req) as Types.Events.PrePaint | null;\n if (!nextPrePaint) {\n continue;\n }\n\n // If the req is outside the ROOT_CAUSE_WINDOW, it could not be a root cause.\n if (!isInRootCauseWindow(req, nextPrePaint)) {\n continue;\n }\n\n // Get the shifts that belong to this prepaint\n const shifts = shiftsByPrePaint.get(nextPrePaint);\n\n // if no layout shift(s) in this prePaint, the request is not a root cause.\n if (!shifts) {\n continue;\n }\n // Include the root cause to the shifts in this prePaint.\n for (const shift of shifts) {\n const rootCausesForShift = rootCausesByShift.get(shift);\n if (!rootCausesForShift) {\n throw new Error('Unaccounted shift');\n }\n rootCausesForShift.webFonts.push(req);\n }\n }\n return rootCausesByShift;\n}\n\n/**\n * Returns the top 3 shift root causes based on the given cluster.\n */\nfunction getTopCulprits(\n cluster: Types.Events.SyntheticLayoutShiftCluster,\n culpritsByShift: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>): LayoutShiftItem[] {\n const MAX_TOP_CULPRITS = 3;\n const causes: LayoutShiftItem[] = [];\n\n const shifts = cluster.events;\n for (const shift of shifts) {\n const culprits = culpritsByShift.get(shift);\n if (!culprits) {\n continue;\n }\n\n const fontReq = culprits.webFonts;\n const iframes = culprits.iframes;\n const animations = culprits.nonCompositedAnimations;\n const unsizedImages = culprits.unsizedImages;\n\n for (let i = 0; i < fontReq.length && causes.length < MAX_TOP_CULPRITS; i++) {\n causes.push({type: LayoutShiftType.WEB_FONT, description: i18nString(UIStrings.webFont)});\n }\n for (let i = 0; i < iframes.length && causes.length < MAX_TOP_CULPRITS; i++) {\n causes.push({type: LayoutShiftType.IFRAMES, description: i18nString(UIStrings.injectedIframe)});\n }\n for (let i = 0; i < animations.length && causes.length < MAX_TOP_CULPRITS; i++) {\n causes.push({type: LayoutShiftType.ANIMATIONS, description: i18nString(UIStrings.animation)});\n }\n for (let i = 0; i < unsizedImages.length && causes.length < MAX_TOP_CULPRITS; i++) {\n causes.push({\n type: LayoutShiftType.UNSIZED_IMAGE,\n description: i18nString(UIStrings.unsizedImage),\n url: unsizedImages[i].paintImageEvent.args.data.url || '',\n backendNodeId: unsizedImages[i].backendNodeId,\n frame: unsizedImages[i].paintImageEvent.args.data.frame || '',\n });\n }\n\n if (causes.length >= MAX_TOP_CULPRITS) {\n break;\n }\n }\n\n return causes.slice(0, MAX_TOP_CULPRITS);\n}\n\nfunction finalize(partialModel: PartialInsightModel<CLSCulpritsInsightModel>): CLSCulpritsInsightModel {\n let state: CLSCulpritsInsightModel['state'] = 'pass';\n if (partialModel.worstCluster) {\n const classification = Handlers.ModelHandlers.LayoutShifts.scoreClassificationForLayoutShift(\n partialModel.worstCluster.clusterCumulativeScore);\n if (classification === Handlers.ModelHandlers.PageLoadMetrics.ScoreClassification.GOOD) {\n state = 'informative';\n } else {\n state = 'fail';\n }\n }\n\n return {\n insightKey: InsightKeys.CLS_CULPRITS,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.CLS,\n state,\n ...partialModel,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): CLSCulpritsInsightModel {\n const isWithinContext = (event: Types.Events.Event): boolean => Helpers.Timing.eventIsInBounds(event, context.bounds);\n\n const compositeAnimationEvents = parsedTrace.Animations.animations.filter(isWithinContext);\n const iframeEvents = parsedTrace.LayoutShifts.renderFrameImplCreateChildFrameEvents.filter(isWithinContext);\n const networkRequests = parsedTrace.NetworkRequests.byTime.filter(isWithinContext);\n const domLoadingEvents = parsedTrace.LayoutShifts.domLoadingEvents.filter(isWithinContext);\n const unsizedImageEvents = parsedTrace.LayoutShifts.layoutImageUnsizedEvents.filter(isWithinContext);\n\n const clusterKey = context.navigation ? context.navigationId : Types.Events.NO_NAVIGATION;\n const clusters = parsedTrace.LayoutShifts.clustersByNavigationId.get(clusterKey) ?? [];\n const clustersByScore = [...clusters].sort((a, b) => b.clusterCumulativeScore - a.clusterCumulativeScore);\n const worstCluster = clustersByScore.at(0);\n const layoutShifts = clusters.flatMap(cluster => cluster.events);\n const prePaintEvents = parsedTrace.LayoutShifts.prePaintEvents.filter(isWithinContext);\n const paintImageEvents = parsedTrace.LayoutShifts.paintImageEvents.filter(isWithinContext);\n\n // Get root causes.\n const rootCausesByShift = new Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>();\n const shiftsByPrePaint = getShiftsByPrePaintEvents(layoutShifts, prePaintEvents);\n\n for (const shift of layoutShifts) {\n rootCausesByShift.set(shift, {iframes: [], webFonts: [], nonCompositedAnimations: [], unsizedImages: []});\n }\n\n // Populate root causes for rootCausesByShift.\n getIframeRootCauses(parsedTrace, iframeEvents, prePaintEvents, shiftsByPrePaint, rootCausesByShift, domLoadingEvents);\n getFontRootCauses(networkRequests, prePaintEvents, shiftsByPrePaint, rootCausesByShift);\n getUnsizedImageRootCauses(unsizedImageEvents, paintImageEvents, shiftsByPrePaint, rootCausesByShift);\n const animationFailures =\n getNonCompositedFailureRootCauses(compositeAnimationEvents, prePaintEvents, shiftsByPrePaint, rootCausesByShift);\n\n const relatedEvents: Types.Events.Event[] = [...layoutShifts];\n if (worstCluster) {\n relatedEvents.push(worstCluster);\n }\n\n const topCulpritsByCluster = new Map<Types.Events.SyntheticLayoutShiftCluster, LayoutShiftItem[]>();\n for (const cluster of clusters) {\n topCulpritsByCluster.set(cluster, getTopCulprits(cluster, rootCausesByShift));\n }\n\n return finalize({\n relatedEvents,\n animationFailures,\n shifts: rootCausesByShift,\n clusters,\n worstCluster,\n topCulpritsByCluster,\n });\n}\n"]}
1
+ {"version":3,"file":"CLSCulprits.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/CLSCulprits.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 Platform from '../../../core/platform/platform.js';\nimport type * as Protocol from '../../../generated/protocol.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 type PartialInsightModel,\n} from './types.js';\n\nexport const UIStrings = {\n /** Title of an insight that provides details about why elements shift/move on the page. The causes for these shifts are referred to as culprits (\"reasons\"). */\n title: 'Layout shift culprits',\n /**\n * @description Description of a DevTools insight that identifies the reasons that elements shift on the page.\n * This is displayed after a user expands the section to see more. No character length limits.\n */\n description:\n 'Layout shifts occur when elements move absent any user interaction. [Investigate the causes of layout shifts](https://web.dev/articles/optimize-cls), such as elements being added, removed, or their fonts changing as the page loads.',\n /**\n *@description Text indicating the worst layout shift cluster.\n */\n worstLayoutShiftCluster: 'Worst layout shift cluster',\n /**\n * @description Text indicating the worst layout shift cluster.\n */\n worstCluster: 'Worst cluster',\n /**\n * @description Text indicating a layout shift cluster and its start time.\n * @example {32 ms} PH1\n */\n layoutShiftCluster: 'Layout shift cluster @ {PH1}',\n /**\n *@description Text indicating the biggest reasons for the layout shifts.\n */\n topCulprits: 'Top layout shift culprits',\n /**\n * @description Text for a culprit type of Injected iframe.\n */\n injectedIframe: 'Injected iframe',\n /**\n * @description Text for a culprit type of web font request.\n */\n webFont: 'Web font',\n /**\n * @description Text for a culprit type of Animation.\n */\n animation: 'Animation',\n /**\n * @description Text for a culprit type of Unsized image.\n */\n unsizedImage: 'Unsized image element',\n /**\n * @description Text status when there were no layout shifts detected.\n */\n noLayoutShifts: 'No layout shifts',\n /**\n * @description Text status when there no layout shifts culprits/root causes were found.\n */\n noCulprits: 'Could not detect any layout shift culprits',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/CLSCulprits.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport type CLSCulpritsInsightModel = InsightModel<typeof UIStrings, {\n animationFailures: readonly NoncompositedAnimationFailure[],\n shifts: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>,\n clusters: Types.Events.SyntheticLayoutShiftCluster[],\n worstCluster: Types.Events.SyntheticLayoutShiftCluster | undefined,\n /** The top 3 shift root causes for each cluster. */\n topCulpritsByCluster: Map<Types.Events.SyntheticLayoutShiftCluster, LayoutShiftItem[]>,\n}>;\n\nexport enum AnimationFailureReasons {\n ACCELERATED_ANIMATIONS_DISABLED = 'ACCELERATED_ANIMATIONS_DISABLED',\n EFFECT_SUPPRESSED_BY_DEVTOOLS = 'EFFECT_SUPPRESSED_BY_DEVTOOLS',\n INVALID_ANIMATION_OR_EFFECT = 'INVALID_ANIMATION_OR_EFFECT',\n EFFECT_HAS_UNSUPPORTED_TIMING_PARAMS = 'EFFECT_HAS_UNSUPPORTED_TIMING_PARAMS',\n EFFECT_HAS_NON_REPLACE_COMPOSITE_MODE = 'EFFECT_HAS_NON_REPLACE_COMPOSITE_MODE',\n TARGET_HAS_INVALID_COMPOSITING_STATE = 'TARGET_HAS_INVALID_COMPOSITING_STATE',\n TARGET_HAS_INCOMPATIBLE_ANIMATIONS = 'TARGET_HAS_INCOMPATIBLE_ANIMATIONS',\n TARGET_HAS_CSS_OFFSET = 'TARGET_HAS_CSS_OFFSET',\n ANIMATION_AFFECTS_NON_CSS_PROPERTIES = 'ANIMATION_AFFECTS_NON_CSS_PROPERTIES',\n TRANSFORM_RELATED_PROPERTY_CANNOT_BE_ACCELERATED_ON_TARGET =\n 'TRANSFORM_RELATED_PROPERTY_CANNOT_BE_ACCELERATED_ON_TARGET',\n TRANSFROM_BOX_SIZE_DEPENDENT = 'TRANSFROM_BOX_SIZE_DEPENDENT',\n FILTER_RELATED_PROPERTY_MAY_MOVE_PIXELS = 'FILTER_RELATED_PROPERTY_MAY_MOVE_PIXELS',\n UNSUPPORTED_CSS_PROPERTY = 'UNSUPPORTED_CSS_PROPERTY',\n MIXED_KEYFRAME_VALUE_TYPES = 'MIXED_KEYFRAME_VALUE_TYPES',\n TIMELINE_SOURCE_HAS_INVALID_COMPOSITING_STATE = 'TIMELINE_SOURCE_HAS_INVALID_COMPOSITING_STATE',\n ANIMATION_HAS_NO_VISIBLE_CHANGE = 'ANIMATION_HAS_NO_VISIBLE_CHANGE',\n AFFECTS_IMPORTANT_PROPERTY = 'AFFECTS_IMPORTANT_PROPERTY',\n SVG_TARGET_HAS_INDEPENDENT_TRANSFORM_PROPERTY = 'SVG_TARGET_HAS_INDEPENDENT_TRANSFORM_PROPERTY',\n}\n\nexport enum LayoutShiftType {\n WEB_FONT = 0,\n IFRAMES = 1,\n ANIMATIONS = 2,\n UNSIZED_IMAGE = 3,\n}\n\nexport type LayoutShiftItem = {\n type: LayoutShiftType.UNSIZED_IMAGE,\n description: Platform.UIString.LocalizedString,\n url: string,\n backendNodeId: Protocol.DOM.BackendNodeId,\n frame: string,\n}|{\n type: Exclude<LayoutShiftType, LayoutShiftType.UNSIZED_IMAGE>,\n description: Platform.UIString.LocalizedString,\n};\n\nexport interface NoncompositedAnimationFailure {\n /**\n * Animation name.\n */\n name?: string;\n /**\n * Failure reason based on mask number defined in\n * https://source.chromium.org/search?q=f:compositor_animations.h%20%22enum%20FailureReason%22.\n */\n failureReasons: AnimationFailureReasons[];\n /**\n * Unsupported properties.\n */\n unsupportedProperties?: Types.Events.Animation['args']['data']['unsupportedProperties'];\n /**\n * Animation event.\n */\n animation?: Types.Events.SyntheticAnimationPair;\n}\n\n/**\n * Each failure reason is represented by a bit flag. The bit shift operator '<<' is used to define\n * which bit corresponds to each failure reason.\n * https://source.chromium.org/search?q=f:compositor_animations.h%20%22enum%20FailureReason%22\n */\nconst ACTIONABLE_FAILURE_REASONS: Array<{\n flag: number,\n failure: AnimationFailureReasons,\n}> =\n [\n {\n flag: 1 << 0,\n failure: AnimationFailureReasons.ACCELERATED_ANIMATIONS_DISABLED,\n },\n {\n flag: 1 << 1,\n failure: AnimationFailureReasons.EFFECT_SUPPRESSED_BY_DEVTOOLS,\n },\n {\n flag: 1 << 2,\n failure: AnimationFailureReasons.INVALID_ANIMATION_OR_EFFECT,\n },\n {\n flag: 1 << 3,\n failure: AnimationFailureReasons.EFFECT_HAS_UNSUPPORTED_TIMING_PARAMS,\n },\n {\n flag: 1 << 4,\n failure: AnimationFailureReasons.EFFECT_HAS_NON_REPLACE_COMPOSITE_MODE,\n },\n {\n flag: 1 << 5,\n failure: AnimationFailureReasons.TARGET_HAS_INVALID_COMPOSITING_STATE,\n },\n {\n flag: 1 << 6,\n failure: AnimationFailureReasons.TARGET_HAS_INCOMPATIBLE_ANIMATIONS,\n },\n {\n flag: 1 << 7,\n failure: AnimationFailureReasons.TARGET_HAS_CSS_OFFSET,\n },\n // The failure 1 << 8 is marked as obsolete in Blink\n {\n flag: 1 << 9,\n failure: AnimationFailureReasons.ANIMATION_AFFECTS_NON_CSS_PROPERTIES,\n },\n {\n flag: 1 << 10,\n failure: AnimationFailureReasons.TRANSFORM_RELATED_PROPERTY_CANNOT_BE_ACCELERATED_ON_TARGET,\n },\n {\n flag: 1 << 11,\n failure: AnimationFailureReasons.TRANSFROM_BOX_SIZE_DEPENDENT,\n },\n {\n flag: 1 << 12,\n failure: AnimationFailureReasons.FILTER_RELATED_PROPERTY_MAY_MOVE_PIXELS,\n },\n {\n flag: 1 << 13,\n failure: AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY,\n },\n // The failure 1 << 14 is marked as obsolete in Blink\n {\n flag: 1 << 15,\n failure: AnimationFailureReasons.MIXED_KEYFRAME_VALUE_TYPES,\n },\n {\n flag: 1 << 16,\n failure: AnimationFailureReasons.TIMELINE_SOURCE_HAS_INVALID_COMPOSITING_STATE,\n },\n {\n flag: 1 << 17,\n failure: AnimationFailureReasons.ANIMATION_HAS_NO_VISIBLE_CHANGE,\n },\n {\n flag: 1 << 18,\n failure: AnimationFailureReasons.AFFECTS_IMPORTANT_PROPERTY,\n },\n {\n flag: 1 << 19,\n failure: AnimationFailureReasons.SVG_TARGET_HAS_INDEPENDENT_TRANSFORM_PROPERTY,\n },\n ] as const;\n\n// 500ms window.\n// Use this window to consider events and requests that may have caused a layout shift.\nconst ROOT_CAUSE_WINDOW = Helpers.Timing.secondsToMicro(Types.Timing.Seconds(0.5));\n\nexport interface UnsizedImage {\n backendNodeId: Protocol.DOM.BackendNodeId;\n paintImageEvent: Types.Events.PaintImage;\n}\n\nexport interface IframeRootCause {\n frame: string;\n url?: string;\n}\n\nexport interface LayoutShiftRootCausesData {\n iframes: IframeRootCause[];\n webFonts: Types.Events.SyntheticNetworkRequest[];\n nonCompositedAnimations: NoncompositedAnimationFailure[];\n unsizedImages: UnsizedImage[];\n}\n\n/**\n * Returns if an event happens within the root cause window, before the target event.\n * ROOT_CAUSE_WINDOW v target event\n * |------------------------|=======================\n */\nfunction isInRootCauseWindow(event: Types.Events.Event, targetEvent: Types.Events.Event): boolean {\n const eventEnd = event.dur ? event.ts + event.dur : event.ts;\n return eventEnd < targetEvent.ts && eventEnd >= targetEvent.ts - ROOT_CAUSE_WINDOW;\n}\n\nexport function getNonCompositedFailure(animationEvent: Types.Events.SyntheticAnimationPair):\n NoncompositedAnimationFailure[] {\n const failures: NoncompositedAnimationFailure[] = [];\n const beginEvent = animationEvent.args.data.beginEvent;\n const instantEvents = animationEvent.args.data.instantEvents || [];\n /**\n * Animation events containing composite information are ASYNC_NESTABLE_INSTANT ('n').\n * An animation may also contain multiple 'n' events, so we look through those with useful non-composited data.\n */\n for (const event of instantEvents) {\n const failureMask = event.args.data.compositeFailed;\n const unsupportedProperties = event.args.data.unsupportedProperties;\n if (!failureMask) {\n continue;\n }\n const failureReasons =\n ACTIONABLE_FAILURE_REASONS.filter(reason => failureMask & reason.flag).map(reason => reason.failure);\n const failure: NoncompositedAnimationFailure = {\n name: beginEvent.args.data.displayName,\n failureReasons,\n unsupportedProperties,\n animation: animationEvent,\n };\n failures.push(failure);\n }\n return failures;\n}\n\nfunction getNonCompositedFailureRootCauses(\n animationEvents: Types.Events.SyntheticAnimationPair[],\n prePaintEvents: Types.Events.PrePaint[],\n shiftsByPrePaint: Map<Types.Events.PrePaint, Types.Events.SyntheticLayoutShift[]>,\n rootCausesByShift: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>,\n ): NoncompositedAnimationFailure[] {\n const allAnimationFailures: NoncompositedAnimationFailure[] = [];\n for (const animation of animationEvents) {\n /**\n * Animation events containing composite information are ASYNC_NESTABLE_INSTANT ('n').\n * An animation may also contain multiple 'n' events, so we look through those with useful non-composited data.\n */\n const failures = getNonCompositedFailure(animation);\n if (!failures) {\n continue;\n }\n allAnimationFailures.push(...failures);\n\n const nextPrePaint = getNextEvent(prePaintEvents, animation) as Types.Events.PrePaint | null;\n // If no following prePaint, this is not a root cause.\n if (!nextPrePaint) {\n continue;\n }\n\n // If the animation event is outside the ROOT_CAUSE_WINDOW, it could not be a root cause.\n if (!isInRootCauseWindow(animation, nextPrePaint)) {\n continue;\n }\n\n const shifts = shiftsByPrePaint.get(nextPrePaint);\n // if no layout shift(s), this is not a root cause.\n if (!shifts) {\n continue;\n }\n\n for (const shift of shifts) {\n const rootCausesForShift = rootCausesByShift.get(shift);\n if (!rootCausesForShift) {\n throw new Error('Unaccounted shift');\n }\n rootCausesForShift.nonCompositedAnimations.push(...failures);\n }\n }\n\n return allAnimationFailures;\n}\n\n/**\n * Given an array of layout shift and PrePaint events, returns a mapping from\n * PrePaint events to layout shifts dispatched within it.\n */\nfunction getShiftsByPrePaintEvents(\n layoutShifts: Types.Events.SyntheticLayoutShift[],\n prePaintEvents: Types.Events.PrePaint[],\n ): Map<Types.Events.PrePaint, Types.Events.SyntheticLayoutShift[]> {\n // Maps from PrePaint events to LayoutShifts that occurred in each one.\n const shiftsByPrePaint = new Map<Types.Events.PrePaint, Types.Events.SyntheticLayoutShift[]>();\n\n // Associate all shifts to their corresponding PrePaint.\n for (const prePaintEvent of prePaintEvents) {\n const firstShiftIndex =\n Platform.ArrayUtilities.nearestIndexFromBeginning(layoutShifts, shift => shift.ts >= prePaintEvent.ts);\n if (firstShiftIndex === null) {\n // No layout shifts registered after this PrePaint start. Continue.\n continue;\n }\n for (let i = firstShiftIndex; i < layoutShifts.length; i++) {\n const shift = layoutShifts[i];\n if (shift.ts >= prePaintEvent.ts && shift.ts <= prePaintEvent.ts + prePaintEvent.dur) {\n const shiftsInPrePaint = Platform.MapUtilities.getWithDefault(shiftsByPrePaint, prePaintEvent, () => []);\n shiftsInPrePaint.push(shift);\n }\n if (shift.ts > prePaintEvent.ts + prePaintEvent.dur) {\n // Reached all layoutShifts of this PrePaint. Break out to continue with the next prePaint event.\n break;\n }\n }\n }\n return shiftsByPrePaint;\n}\n\n/**\n * Given a source event list, this returns the first event of that list that directly follows the target event.\n */\nfunction getNextEvent(sourceEvents: Types.Events.Event[], targetEvent: Types.Events.Event): Types.Events.Event|\n undefined {\n const index = Platform.ArrayUtilities.nearestIndexFromBeginning(\n sourceEvents, source => source.ts > targetEvent.ts + (targetEvent.dur || 0));\n // No PrePaint event registered after this event\n if (index === null) {\n return undefined;\n }\n\n return sourceEvents[index];\n}\n\n/**\n * An Iframe is considered a root cause if the iframe event occurs before a prePaint event\n * and within this prePaint event a layout shift(s) occurs.\n */\nfunction getIframeRootCauses(\n parsedTrace: Handlers.Types.ParsedTrace,\n iframeCreatedEvents: readonly Types.Events.RenderFrameImplCreateChildFrame[],\n prePaintEvents: Types.Events.PrePaint[],\n shiftsByPrePaint: Map<Types.Events.PrePaint, Types.Events.SyntheticLayoutShift[]>,\n rootCausesByShift: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>,\n domLoadingEvents: readonly Types.Events.DomLoading[]):\n Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData> {\n for (const iframeEvent of iframeCreatedEvents) {\n const nextPrePaint = getNextEvent(prePaintEvents, iframeEvent) as Types.Events.PrePaint | null;\n // If no following prePaint, this is not a root cause.\n if (!nextPrePaint) {\n continue;\n }\n const shifts = shiftsByPrePaint.get(nextPrePaint);\n // if no layout shift(s), this is not a root cause.\n if (!shifts) {\n continue;\n }\n for (const shift of shifts) {\n const rootCausesForShift = rootCausesByShift.get(shift);\n if (!rootCausesForShift) {\n throw new Error('Unaccounted shift');\n }\n\n // Look for the first dom event that occurs within the bounds of the iframe event.\n // This contains the frame id.\n const domEvent = domLoadingEvents.find(e => {\n const maxIframe = Types.Timing.Micro(iframeEvent.ts + (iframeEvent.dur ?? 0));\n return e.ts >= iframeEvent.ts && e.ts <= maxIframe;\n });\n if (domEvent?.args.frame) {\n const frame = domEvent.args.frame;\n\n let url;\n const processes = parsedTrace.Meta.rendererProcessesByFrame.get(frame);\n if (processes && processes.size > 0) {\n url = [...processes.values()][0]?.[0].frame.url;\n }\n\n rootCausesForShift.iframes.push({frame, url});\n }\n }\n }\n return rootCausesByShift;\n}\n\n/**\n * An unsized image is considered a root cause if its PaintImage can be correlated to a\n * layout shift. We can correlate PaintImages with unsized images by their matching nodeIds.\n * X <- layout shift\n * |----------------|\n * ^ PrePaint event |-----|\n * ^ PaintImage\n */\nfunction getUnsizedImageRootCauses(\n unsizedImageEvents: readonly Types.Events.LayoutImageUnsized[], paintImageEvents: Types.Events.PaintImage[],\n shiftsByPrePaint: Map<Types.Events.PrePaint, Types.Events.SyntheticLayoutShift[]>,\n rootCausesByShift: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>):\n Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData> {\n shiftsByPrePaint.forEach((shifts, prePaint) => {\n const paintImage = getNextEvent(paintImageEvents, prePaint) as Types.Events.PaintImage | null;\n if (!paintImage) {\n return;\n }\n // The unsized image corresponds to this PaintImage.\n const matchingNode =\n unsizedImageEvents.find(unsizedImage => unsizedImage.args.data.nodeId === paintImage.args.data.nodeId);\n if (!matchingNode) {\n return;\n }\n // The unsized image is a potential root cause of all the shifts of this prePaint.\n for (const shift of shifts) {\n const rootCausesForShift = rootCausesByShift.get(shift);\n if (!rootCausesForShift) {\n throw new Error('Unaccounted shift');\n }\n rootCausesForShift.unsizedImages.push({\n backendNodeId: matchingNode.args.data.nodeId,\n paintImageEvent: paintImage,\n });\n }\n });\n return rootCausesByShift;\n}\n\nexport function isCLSCulprits(insight: InsightModel): insight is CLSCulpritsInsightModel {\n return insight.insightKey === InsightKeys.CLS_CULPRITS;\n}\n\n/**\n * A font request is considered a root cause if the request occurs before a prePaint event\n * and within this prePaint event a layout shift(s) occurs. Additionally, this font request should\n * happen within the ROOT_CAUSE_WINDOW of the prePaint event.\n */\nfunction getFontRootCauses(\n networkRequests: Types.Events.SyntheticNetworkRequest[], prePaintEvents: Types.Events.PrePaint[],\n shiftsByPrePaint: Map<Types.Events.PrePaint, Types.Events.SyntheticLayoutShift[]>,\n rootCausesByShift: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>):\n Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData> {\n const fontRequests =\n networkRequests.filter(req => req.args.data.resourceType === 'Font' && req.args.data.mimeType.startsWith('font'));\n\n for (const req of fontRequests) {\n const nextPrePaint = getNextEvent(prePaintEvents, req) as Types.Events.PrePaint | null;\n if (!nextPrePaint) {\n continue;\n }\n\n // If the req is outside the ROOT_CAUSE_WINDOW, it could not be a root cause.\n if (!isInRootCauseWindow(req, nextPrePaint)) {\n continue;\n }\n\n // Get the shifts that belong to this prepaint\n const shifts = shiftsByPrePaint.get(nextPrePaint);\n\n // if no layout shift(s) in this prePaint, the request is not a root cause.\n if (!shifts) {\n continue;\n }\n // Include the root cause to the shifts in this prePaint.\n for (const shift of shifts) {\n const rootCausesForShift = rootCausesByShift.get(shift);\n if (!rootCausesForShift) {\n throw new Error('Unaccounted shift');\n }\n rootCausesForShift.webFonts.push(req);\n }\n }\n return rootCausesByShift;\n}\n\n/**\n * Returns the top 3 shift root causes based on the given cluster.\n */\nfunction getTopCulprits(\n cluster: Types.Events.SyntheticLayoutShiftCluster,\n culpritsByShift: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>): LayoutShiftItem[] {\n const MAX_TOP_CULPRITS = 3;\n const causes: LayoutShiftItem[] = [];\n\n const shifts = cluster.events;\n for (const shift of shifts) {\n const culprits = culpritsByShift.get(shift);\n if (!culprits) {\n continue;\n }\n\n const fontReq = culprits.webFonts;\n const iframes = culprits.iframes;\n const animations = culprits.nonCompositedAnimations;\n const unsizedImages = culprits.unsizedImages;\n\n for (let i = 0; i < fontReq.length && causes.length < MAX_TOP_CULPRITS; i++) {\n causes.push({type: LayoutShiftType.WEB_FONT, description: i18nString(UIStrings.webFont)});\n }\n for (let i = 0; i < iframes.length && causes.length < MAX_TOP_CULPRITS; i++) {\n causes.push({type: LayoutShiftType.IFRAMES, description: i18nString(UIStrings.injectedIframe)});\n }\n for (let i = 0; i < animations.length && causes.length < MAX_TOP_CULPRITS; i++) {\n causes.push({type: LayoutShiftType.ANIMATIONS, description: i18nString(UIStrings.animation)});\n }\n for (let i = 0; i < unsizedImages.length && causes.length < MAX_TOP_CULPRITS; i++) {\n causes.push({\n type: LayoutShiftType.UNSIZED_IMAGE,\n description: i18nString(UIStrings.unsizedImage),\n url: unsizedImages[i].paintImageEvent.args.data.url || '',\n backendNodeId: unsizedImages[i].backendNodeId,\n frame: unsizedImages[i].paintImageEvent.args.data.frame || '',\n });\n }\n\n if (causes.length >= MAX_TOP_CULPRITS) {\n break;\n }\n }\n\n return causes.slice(0, MAX_TOP_CULPRITS);\n}\n\nfunction finalize(partialModel: PartialInsightModel<CLSCulpritsInsightModel>): CLSCulpritsInsightModel {\n let state: CLSCulpritsInsightModel['state'] = 'pass';\n if (partialModel.worstCluster) {\n const classification = Handlers.ModelHandlers.LayoutShifts.scoreClassificationForLayoutShift(\n partialModel.worstCluster.clusterCumulativeScore);\n if (classification === Handlers.ModelHandlers.PageLoadMetrics.ScoreClassification.GOOD) {\n state = 'informative';\n } else {\n state = 'fail';\n }\n }\n\n return {\n insightKey: InsightKeys.CLS_CULPRITS,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.CLS,\n state,\n ...partialModel,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): CLSCulpritsInsightModel {\n const isWithinContext = (event: Types.Events.Event): boolean => Helpers.Timing.eventIsInBounds(event, context.bounds);\n\n const compositeAnimationEvents = parsedTrace.Animations.animations.filter(isWithinContext);\n const iframeEvents = parsedTrace.LayoutShifts.renderFrameImplCreateChildFrameEvents.filter(isWithinContext);\n const networkRequests = parsedTrace.NetworkRequests.byTime.filter(isWithinContext);\n const domLoadingEvents = parsedTrace.LayoutShifts.domLoadingEvents.filter(isWithinContext);\n const unsizedImageEvents = parsedTrace.LayoutShifts.layoutImageUnsizedEvents.filter(isWithinContext);\n\n const clusterKey = context.navigation ? context.navigationId : Types.Events.NO_NAVIGATION;\n const clusters = parsedTrace.LayoutShifts.clustersByNavigationId.get(clusterKey) ?? [];\n const clustersByScore = [...clusters].sort((a, b) => b.clusterCumulativeScore - a.clusterCumulativeScore);\n const worstCluster = clustersByScore.at(0);\n const layoutShifts = clusters.flatMap(cluster => cluster.events);\n const prePaintEvents = parsedTrace.LayoutShifts.prePaintEvents.filter(isWithinContext);\n const paintImageEvents = parsedTrace.LayoutShifts.paintImageEvents.filter(isWithinContext);\n\n // Get root causes.\n const rootCausesByShift = new Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>();\n const shiftsByPrePaint = getShiftsByPrePaintEvents(layoutShifts, prePaintEvents);\n\n for (const shift of layoutShifts) {\n rootCausesByShift.set(shift, {iframes: [], webFonts: [], nonCompositedAnimations: [], unsizedImages: []});\n }\n\n // Populate root causes for rootCausesByShift.\n getIframeRootCauses(parsedTrace, iframeEvents, prePaintEvents, shiftsByPrePaint, rootCausesByShift, domLoadingEvents);\n getFontRootCauses(networkRequests, prePaintEvents, shiftsByPrePaint, rootCausesByShift);\n getUnsizedImageRootCauses(unsizedImageEvents, paintImageEvents, shiftsByPrePaint, rootCausesByShift);\n const animationFailures =\n getNonCompositedFailureRootCauses(compositeAnimationEvents, prePaintEvents, shiftsByPrePaint, rootCausesByShift);\n\n const relatedEvents: Types.Events.Event[] = [...layoutShifts];\n if (worstCluster) {\n relatedEvents.push(worstCluster);\n }\n\n const topCulpritsByCluster = new Map<Types.Events.SyntheticLayoutShiftCluster, LayoutShiftItem[]>();\n for (const cluster of clusters) {\n topCulpritsByCluster.set(cluster, getTopCulprits(cluster, rootCausesByShift));\n }\n\n return finalize({\n relatedEvents,\n animationFailures,\n shifts: rootCausesByShift,\n clusters,\n worstCluster,\n topCulpritsByCluster,\n });\n}\n\nexport function createOverlays(model: CLSCulpritsInsightModel): Types.Overlays.Overlay[] {\n const clustersByScore = model.clusters.toSorted((a, b) => b.clusterCumulativeScore - a.clusterCumulativeScore) ?? [];\n const worstCluster = clustersByScore[0];\n if (!worstCluster) {\n return [];\n }\n\n const range = Types.Timing.Micro(worstCluster.dur ?? 0);\n const max = Types.Timing.Micro(worstCluster.ts + range);\n\n return [{\n type: 'TIMESPAN_BREAKDOWN',\n sections: [\n {\n bounds: {min: worstCluster.ts, range, max},\n label: i18nString(UIStrings.worstLayoutShiftCluster),\n showDuration: false,\n },\n ],\n // This allows for the overlay to sit over the layout shift.\n entry: worstCluster.events[0],\n renderLocation: 'ABOVE_EVENT',\n }];\n}\n"]}
@@ -66,3 +66,5 @@ export interface CacheableRequest {
66
66
  wastedBytes: number;
67
67
  }
68
68
  export declare function generateInsight(parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): CacheInsightModel;
69
+ export declare function createOverlayForRequest(request: Types.Events.SyntheticNetworkRequest): Types.Overlays.EntryOutline;
70
+ export declare function createOverlays(model: CacheInsightModel): Types.Overlays.Overlay[];
@@ -193,4 +193,14 @@ export function generateInsight(parsedTrace, context) {
193
193
  wastedBytes: totalWastedBytes,
194
194
  });
195
195
  }
196
+ export function createOverlayForRequest(request) {
197
+ return {
198
+ type: 'ENTRY_OUTLINE',
199
+ entry: request,
200
+ outlineReason: 'ERROR',
201
+ };
202
+ }
203
+ export function createOverlays(model) {
204
+ return model.requests.map(req => createOverlayForRequest(req.request));
205
+ }
196
206
  //# sourceMappingURL=Cache.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Cache.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/Cache.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 Types from '../types/types.js';\n\nimport {metricSavingsForWastedBytes} from './Common.js';\nimport {linearInterpolation} from './Statistics.js';\nimport {\n InsightCategory,\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 information and suggestions of resources that could improve their caching.\n */\n title: 'Use efficient cache lifetimes',\n /**\n * @description Text to tell the user about how caching can help improve performance.\n */\n description:\n 'A long cache lifetime can speed up repeat visits to your page. [Learn more](https://web.dev/uses-long-cache-ttl/).',\n /**\n * @description Column for a font loaded by the page to render text.\n */\n requestColumn: 'Request',\n /**\n * @description Column for a resource cache's Time To Live.\n */\n cacheTTL: 'Cache TTL',\n /**\n * @description Text describing that there were no requests found that need caching.\n */\n noRequestsToCache: 'No requests with inefficient cache policies',\n /**\n * @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.\n * @example {5} PH1\n */\n others: '{PH1} others',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/Cache.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport type CacheInsightModel = InsightModel<typeof UIStrings, {\n requests: Array<{\n request: Types.Events.SyntheticNetworkRequest,\n ttl: number,\n wastedBytes: number,\n }>,\n}>;\n\n// Threshold for cache hits.\nconst IGNORE_THRESHOLD_IN_PERCENT = 0.925;\n\nfunction finalize(partialModel: PartialInsightModel<CacheInsightModel>): CacheInsightModel {\n return {\n insightKey: 'Cache',\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.ALL,\n state: partialModel.requests.length > 0 ? 'fail' : 'pass',\n ...partialModel,\n };\n}\n\n/**\n * Determines if a request is \"cacheable\".\n * A request is \"cacheable\" if it is of the appropriate protocol and resource type\n * (see Helpers.Network.NON_NETWORK_SCHEMES and Helpers.Network.STATIC_RESOURCE_TYPE)\n * and has the appropriate statusCodes.\n */\nexport function isCacheable(request: Types.Events.SyntheticNetworkRequest): boolean {\n // Caching doesn't make sense for requests not loaded over the network.\n if (Helpers.Network.NON_NETWORK_SCHEMES.includes(request.args.data.protocol)) {\n return false;\n }\n return Boolean(\n Helpers.Network.CACHEABLE_STATUS_CODES.has(request.args.data.statusCode) &&\n Helpers.Network.STATIC_RESOURCE_TYPES.has(request.args.data.resourceType || Protocol.Network.ResourceType.Other));\n}\n\n/**\n * Returns max-age if defined, otherwise expires header if defined, and null if not.\n */\nexport function computeCacheLifetimeInSeconds(\n headers: Array<{name: string, value: string}>, cacheControl: Helpers.Network.CacheControl|null): number|null {\n if (cacheControl?.['max-age'] !== undefined) {\n return cacheControl['max-age'];\n }\n\n const expiresHeaders = headers.find(h => h.name === 'expires')?.value ?? null;\n if (expiresHeaders) {\n const expires = new Date(expiresHeaders).getTime();\n // Treat expires values as having already expired.\n if (!expires) {\n return 0;\n }\n return Math.ceil((expires - Date.now()) / 1000);\n }\n return null;\n}\n\n/**\n * Computes the percent likelihood that a return visit will be within the cache lifetime, based on\n * historical Chrome UMA stats (see RESOURCE_AGE_IN_HOURS_DECILES comment).\n *\n * This function returns values on this curve: https://www.desmos.com/calculator/eaqiszhugy (but using seconds, rather than hours)\n * See http://github.com/GoogleChrome/lighthouse/pull/3531 for history.\n */\nfunction getCacheHitProbability(maxAgeInSeconds: number): number {\n // This array contains the hand wavy distribution of the age of a resource in hours at the time of\n // cache hit at 0th, 10th, 20th, 30th, etc percentiles. This is used to compute `wastedMs` since there\n // are clearly diminishing returns to cache duration i.e. 6 months is not 2x better than 3 months.\n // Based on UMA stats for HttpCache.StaleEntry.Validated.Age. see https://www.desmos.com/calculator/jjwc5mzuwd\n // This UMA data is from 2017 but the metric isn't tracked any longer in 2025.\n const RESOURCE_AGE_IN_HOURS_DECILES = [0, 0.2, 1, 3, 8, 12, 24, 48, 72, 168, 8760, Infinity];\n\n const maxAgeInHours = maxAgeInSeconds / 3600;\n const upperDecileIndex = RESOURCE_AGE_IN_HOURS_DECILES.findIndex(decile => decile >= maxAgeInHours);\n\n // Clip the likelihood between 0 and 1\n if (upperDecileIndex === RESOURCE_AGE_IN_HOURS_DECILES.length - 1) {\n return 1;\n }\n if (upperDecileIndex === 0) {\n return 0;\n }\n\n // Use the two closest decile points as control points\n const upperDecileValue = RESOURCE_AGE_IN_HOURS_DECILES[upperDecileIndex];\n const lowerDecileValue = RESOURCE_AGE_IN_HOURS_DECILES[upperDecileIndex - 1];\n const upperDecile = upperDecileIndex / 10;\n const lowerDecile = (upperDecileIndex - 1) / 10;\n\n // Approximate the real likelihood with linear interpolation\n return linearInterpolation(lowerDecileValue, lowerDecile, upperDecileValue, upperDecile, maxAgeInHours);\n}\n\nexport function getCombinedHeaders(responseHeaders: Array<{name: string, value: string}>): Map<string, string> {\n const headers = new Map<string, string>();\n for (const header of responseHeaders) {\n const name = header.name.toLowerCase();\n if (headers.get(name)) {\n headers.set(name, `${headers.get(name)}, ${header.value}`);\n } else {\n headers.set(name, header.value);\n }\n }\n return headers;\n}\n\n/**\n * Returns whether a request contains headers that disable caching.\n * Disabled caching is checked on the 'cache-control' and 'pragma' headers.\n */\nexport function cachingDisabled(\n headers: Map<string, string>|null, parsedCacheControl: Helpers.Network.CacheControl|null): boolean {\n const cacheControl = headers?.get('cache-control') ?? null;\n const pragma = headers?.get('pragma') ?? null;\n\n // The HTTP/1.0 Pragma header can disable caching if cache-control is not set, see https://tools.ietf.org/html/rfc7234#section-5.4\n if (!cacheControl && pragma?.includes('no-cache')) {\n return true;\n }\n\n // If we have any of these, the user intentionally doesn't want to cache.\n if (parsedCacheControl &&\n (parsedCacheControl['must-revalidate'] || parsedCacheControl['no-cache'] || parsedCacheControl['no-store'] ||\n parsedCacheControl['private'])) {\n return true;\n }\n\n return false;\n}\n\nexport interface CacheableRequest {\n request: Types.Events.SyntheticNetworkRequest;\n ttl: number;\n wastedBytes: number;\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): CacheInsightModel {\n const isWithinContext = (event: Types.Events.Event): boolean => Helpers.Timing.eventIsInBounds(event, context.bounds);\n const contextRequests = parsedTrace.NetworkRequests.byTime.filter(isWithinContext);\n\n const results: CacheableRequest[] = [];\n let totalWastedBytes = 0;\n const wastedBytesByRequestId = new Map<string, number>();\n for (const req of contextRequests) {\n if (!req.args.data.responseHeaders || !isCacheable(req)) {\n continue;\n }\n\n const headers = getCombinedHeaders(req.args.data.responseHeaders);\n const cacheControl = headers.get('cache-control') ?? null;\n const parsedDirectives = Helpers.Network.parseCacheControl(cacheControl);\n\n // Skip requests that are deliberately avoiding caching.\n if (cachingDisabled(headers, parsedDirectives)) {\n continue;\n }\n\n let ttl = computeCacheLifetimeInSeconds(req.args.data.responseHeaders, parsedDirectives);\n // Ignore if a non-positive number.\n if (ttl !== null && (!Number.isFinite(ttl) || ttl <= 0)) {\n continue;\n }\n ttl = ttl || 0;\n\n // Ignore >= 30d.\n const ttlDays = ttl / 86400;\n if (ttlDays >= 30) {\n continue;\n }\n\n // If cache lifetime is high enough, let's skip.\n const cacheHitProbability = getCacheHitProbability(ttl);\n if (cacheHitProbability > IGNORE_THRESHOLD_IN_PERCENT) {\n continue;\n }\n\n const transferSize = req.args.data.encodedDataLength || 0;\n const wastedBytes = (1 - cacheHitProbability) * transferSize;\n\n wastedBytesByRequestId.set(req.args.data.requestId, wastedBytes);\n totalWastedBytes += wastedBytes;\n\n results.push({request: req, ttl, wastedBytes});\n }\n\n // Sort by transfer size.\n results.sort((a, b) => {\n return b.request.args.data.decodedBodyLength - a.request.args.data.decodedBodyLength || a.ttl - b.ttl;\n });\n\n return finalize({\n relatedEvents: results.map(r => r.request),\n requests: results,\n metricSavings: metricSavingsForWastedBytes(wastedBytesByRequestId, context),\n wastedBytes: totalWastedBytes,\n });\n}\n"]}
1
+ {"version":3,"file":"Cache.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/Cache.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 Types from '../types/types.js';\n\nimport {metricSavingsForWastedBytes} from './Common.js';\nimport {linearInterpolation} from './Statistics.js';\nimport {\n InsightCategory,\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 information and suggestions of resources that could improve their caching.\n */\n title: 'Use efficient cache lifetimes',\n /**\n * @description Text to tell the user about how caching can help improve performance.\n */\n description:\n 'A long cache lifetime can speed up repeat visits to your page. [Learn more](https://web.dev/uses-long-cache-ttl/).',\n /**\n * @description Column for a font loaded by the page to render text.\n */\n requestColumn: 'Request',\n /**\n * @description Column for a resource cache's Time To Live.\n */\n cacheTTL: 'Cache TTL',\n /**\n * @description Text describing that there were no requests found that need caching.\n */\n noRequestsToCache: 'No requests with inefficient cache policies',\n /**\n * @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.\n * @example {5} PH1\n */\n others: '{PH1} others',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/Cache.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nexport type CacheInsightModel = InsightModel<typeof UIStrings, {\n requests: Array<{\n request: Types.Events.SyntheticNetworkRequest,\n ttl: number,\n wastedBytes: number,\n }>,\n}>;\n\n// Threshold for cache hits.\nconst IGNORE_THRESHOLD_IN_PERCENT = 0.925;\n\nfunction finalize(partialModel: PartialInsightModel<CacheInsightModel>): CacheInsightModel {\n return {\n insightKey: 'Cache',\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.ALL,\n state: partialModel.requests.length > 0 ? 'fail' : 'pass',\n ...partialModel,\n };\n}\n\n/**\n * Determines if a request is \"cacheable\".\n * A request is \"cacheable\" if it is of the appropriate protocol and resource type\n * (see Helpers.Network.NON_NETWORK_SCHEMES and Helpers.Network.STATIC_RESOURCE_TYPE)\n * and has the appropriate statusCodes.\n */\nexport function isCacheable(request: Types.Events.SyntheticNetworkRequest): boolean {\n // Caching doesn't make sense for requests not loaded over the network.\n if (Helpers.Network.NON_NETWORK_SCHEMES.includes(request.args.data.protocol)) {\n return false;\n }\n return Boolean(\n Helpers.Network.CACHEABLE_STATUS_CODES.has(request.args.data.statusCode) &&\n Helpers.Network.STATIC_RESOURCE_TYPES.has(request.args.data.resourceType || Protocol.Network.ResourceType.Other));\n}\n\n/**\n * Returns max-age if defined, otherwise expires header if defined, and null if not.\n */\nexport function computeCacheLifetimeInSeconds(\n headers: Array<{name: string, value: string}>, cacheControl: Helpers.Network.CacheControl|null): number|null {\n if (cacheControl?.['max-age'] !== undefined) {\n return cacheControl['max-age'];\n }\n\n const expiresHeaders = headers.find(h => h.name === 'expires')?.value ?? null;\n if (expiresHeaders) {\n const expires = new Date(expiresHeaders).getTime();\n // Treat expires values as having already expired.\n if (!expires) {\n return 0;\n }\n return Math.ceil((expires - Date.now()) / 1000);\n }\n return null;\n}\n\n/**\n * Computes the percent likelihood that a return visit will be within the cache lifetime, based on\n * historical Chrome UMA stats (see RESOURCE_AGE_IN_HOURS_DECILES comment).\n *\n * This function returns values on this curve: https://www.desmos.com/calculator/eaqiszhugy (but using seconds, rather than hours)\n * See http://github.com/GoogleChrome/lighthouse/pull/3531 for history.\n */\nfunction getCacheHitProbability(maxAgeInSeconds: number): number {\n // This array contains the hand wavy distribution of the age of a resource in hours at the time of\n // cache hit at 0th, 10th, 20th, 30th, etc percentiles. This is used to compute `wastedMs` since there\n // are clearly diminishing returns to cache duration i.e. 6 months is not 2x better than 3 months.\n // Based on UMA stats for HttpCache.StaleEntry.Validated.Age. see https://www.desmos.com/calculator/jjwc5mzuwd\n // This UMA data is from 2017 but the metric isn't tracked any longer in 2025.\n const RESOURCE_AGE_IN_HOURS_DECILES = [0, 0.2, 1, 3, 8, 12, 24, 48, 72, 168, 8760, Infinity];\n\n const maxAgeInHours = maxAgeInSeconds / 3600;\n const upperDecileIndex = RESOURCE_AGE_IN_HOURS_DECILES.findIndex(decile => decile >= maxAgeInHours);\n\n // Clip the likelihood between 0 and 1\n if (upperDecileIndex === RESOURCE_AGE_IN_HOURS_DECILES.length - 1) {\n return 1;\n }\n if (upperDecileIndex === 0) {\n return 0;\n }\n\n // Use the two closest decile points as control points\n const upperDecileValue = RESOURCE_AGE_IN_HOURS_DECILES[upperDecileIndex];\n const lowerDecileValue = RESOURCE_AGE_IN_HOURS_DECILES[upperDecileIndex - 1];\n const upperDecile = upperDecileIndex / 10;\n const lowerDecile = (upperDecileIndex - 1) / 10;\n\n // Approximate the real likelihood with linear interpolation\n return linearInterpolation(lowerDecileValue, lowerDecile, upperDecileValue, upperDecile, maxAgeInHours);\n}\n\nexport function getCombinedHeaders(responseHeaders: Array<{name: string, value: string}>): Map<string, string> {\n const headers = new Map<string, string>();\n for (const header of responseHeaders) {\n const name = header.name.toLowerCase();\n if (headers.get(name)) {\n headers.set(name, `${headers.get(name)}, ${header.value}`);\n } else {\n headers.set(name, header.value);\n }\n }\n return headers;\n}\n\n/**\n * Returns whether a request contains headers that disable caching.\n * Disabled caching is checked on the 'cache-control' and 'pragma' headers.\n */\nexport function cachingDisabled(\n headers: Map<string, string>|null, parsedCacheControl: Helpers.Network.CacheControl|null): boolean {\n const cacheControl = headers?.get('cache-control') ?? null;\n const pragma = headers?.get('pragma') ?? null;\n\n // The HTTP/1.0 Pragma header can disable caching if cache-control is not set, see https://tools.ietf.org/html/rfc7234#section-5.4\n if (!cacheControl && pragma?.includes('no-cache')) {\n return true;\n }\n\n // If we have any of these, the user intentionally doesn't want to cache.\n if (parsedCacheControl &&\n (parsedCacheControl['must-revalidate'] || parsedCacheControl['no-cache'] || parsedCacheControl['no-store'] ||\n parsedCacheControl['private'])) {\n return true;\n }\n\n return false;\n}\n\nexport interface CacheableRequest {\n request: Types.Events.SyntheticNetworkRequest;\n ttl: number;\n wastedBytes: number;\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): CacheInsightModel {\n const isWithinContext = (event: Types.Events.Event): boolean => Helpers.Timing.eventIsInBounds(event, context.bounds);\n const contextRequests = parsedTrace.NetworkRequests.byTime.filter(isWithinContext);\n\n const results: CacheableRequest[] = [];\n let totalWastedBytes = 0;\n const wastedBytesByRequestId = new Map<string, number>();\n for (const req of contextRequests) {\n if (!req.args.data.responseHeaders || !isCacheable(req)) {\n continue;\n }\n\n const headers = getCombinedHeaders(req.args.data.responseHeaders);\n const cacheControl = headers.get('cache-control') ?? null;\n const parsedDirectives = Helpers.Network.parseCacheControl(cacheControl);\n\n // Skip requests that are deliberately avoiding caching.\n if (cachingDisabled(headers, parsedDirectives)) {\n continue;\n }\n\n let ttl = computeCacheLifetimeInSeconds(req.args.data.responseHeaders, parsedDirectives);\n // Ignore if a non-positive number.\n if (ttl !== null && (!Number.isFinite(ttl) || ttl <= 0)) {\n continue;\n }\n ttl = ttl || 0;\n\n // Ignore >= 30d.\n const ttlDays = ttl / 86400;\n if (ttlDays >= 30) {\n continue;\n }\n\n // If cache lifetime is high enough, let's skip.\n const cacheHitProbability = getCacheHitProbability(ttl);\n if (cacheHitProbability > IGNORE_THRESHOLD_IN_PERCENT) {\n continue;\n }\n\n const transferSize = req.args.data.encodedDataLength || 0;\n const wastedBytes = (1 - cacheHitProbability) * transferSize;\n\n wastedBytesByRequestId.set(req.args.data.requestId, wastedBytes);\n totalWastedBytes += wastedBytes;\n\n results.push({request: req, ttl, wastedBytes});\n }\n\n // Sort by transfer size.\n results.sort((a, b) => {\n return b.request.args.data.decodedBodyLength - a.request.args.data.decodedBodyLength || a.ttl - b.ttl;\n });\n\n return finalize({\n relatedEvents: results.map(r => r.request),\n requests: results,\n metricSavings: metricSavingsForWastedBytes(wastedBytesByRequestId, context),\n wastedBytes: totalWastedBytes,\n });\n}\n\nexport function createOverlayForRequest(request: Types.Events.SyntheticNetworkRequest): Types.Overlays.EntryOutline {\n return {\n type: 'ENTRY_OUTLINE',\n entry: request,\n outlineReason: 'ERROR',\n };\n}\n\nexport function createOverlays(model: CacheInsightModel): Types.Overlays.Overlay[] {\n return model.requests.map(req => createOverlayForRequest(req.request));\n}\n"]}
@@ -67,3 +67,4 @@ export type DOMSizeInsightModel = InsightModel<typeof UIStrings, {
67
67
  maxDOMStats?: Types.Events.DOMStats;
68
68
  }>;
69
69
  export declare function generateInsight(parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): DOMSizeInsightModel;
70
+ export declare function createOverlays(model: DOMSizeInsightModel): Types.Overlays.Overlay[];
@@ -167,4 +167,12 @@ export function generateInsight(parsedTrace, context) {
167
167
  maxDOMStats,
168
168
  });
169
169
  }
170
+ export function createOverlays(model) {
171
+ const entries = [...model.largeStyleRecalcs, ...model.largeLayoutUpdates];
172
+ return entries.map(entry => ({
173
+ type: 'ENTRY_OUTLINE',
174
+ entry,
175
+ outlineReason: 'ERROR',
176
+ }));
177
+ }
170
178
  //# sourceMappingURL=DOMSize.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DOMSize.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/DOMSize.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 type * as Common from '../../../core/common/common.js';\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 type PartialInsightModel,\n} from './types.js';\n\nexport const UIStrings = {\n /**\n * @description Title of an insight that recommends reducing the size of the DOM tree as a means to improve page responsiveness. \"DOM\" is an acronym and should not be translated.\n */\n title: 'Optimize DOM size',\n /**\n * @description Description of an insight that recommends reducing the size of the DOM tree as a means to improve page responsiveness. \"DOM\" is an acronym and should not be translated. \"layout reflows\" are when the browser will recompute the layout of content on the page.\n */\n description:\n 'A large DOM can increase the duration of style calculations and layout reflows, impacting page responsiveness. A large DOM will also increase memory usage. [Learn how to avoid an excessive DOM size](https://developer.chrome.com/docs/lighthouse/performance/dom-size/).',\n /**\n * @description Header for a column containing the names of statistics as opposed to the actual statistic values.\n */\n statistic: 'Statistic',\n /**\n * @description Header for a column containing the value of a statistic.\n */\n value: 'Value',\n /**\n * @description Header for a column containing the page element related to a statistic.\n */\n element: 'Element',\n /**\n * @description Label for a value representing the total number of elements on the page.\n */\n totalElements: 'Total elements',\n /**\n * @description Label for a value representing the maximum depth of the Document Object Model (DOM). \"DOM\" is a acronym and should not be translated.\n */\n maxDOMDepth: 'DOM depth',\n /**\n * @description Label for a value representing the maximum number of child elements of any parent element on the page.\n */\n maxChildren: 'Most children',\n /**\n * @description Text for a section.\n */\n topUpdatesDescription:\n 'These are the largest layout and style recalculation events. Their performance impact may be reduced by making the DOM simpler.',\n /**\n *@description Label used for a time duration.\n */\n duration: 'Duration',\n /**\n * @description Message displayed in a table detailing how big a layout (rendering) is.\n * @example {134} PH1\n */\n largeLayout: 'Layout ({PH1} objects)',\n /**\n * @description Message displayed in a table detailing how big a style recalculation (rendering) is.\n * @example {134} PH1\n */\n largeStyleRecalc: 'Style recalculation ({PH1} elements)',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/DOMSize.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nconst DOM_SIZE_DURATION_THRESHOLD = Helpers.Timing.milliToMicro(Types.Timing.Milli(40));\n\n// These thresholds were selected to maximize the number of long (>40ms) events above\n// the threshold while maximizing the number of short (<40ms) events below the threshold.\n// See go/rpp-dom-size-thresholds for the analysis that produced these thresholds.\nconst LAYOUT_OBJECTS_THRESHOLD = 100;\nconst STYLE_RECALC_ELEMENTS_THRESHOLD = 300;\n\nexport type DOMSizeInsightModel = InsightModel<typeof UIStrings, {\n largeLayoutUpdates: Types.Events.Layout[],\n largeStyleRecalcs: Types.Events.UpdateLayoutTree[],\n largeUpdates: Array<\n {label: Common.UIString.LocalizedString, duration: Types.Timing.Milli, size: number, event: Types.Events.Event}>,\n maxDOMStats?: Types.Events.DOMStats,\n}>;\n\nfunction finalize(partialModel: PartialInsightModel<DOMSizeInsightModel>): DOMSizeInsightModel {\n const relatedEvents = [...partialModel.largeLayoutUpdates, ...partialModel.largeStyleRecalcs];\n return {\n insightKey: InsightKeys.DOM_SIZE,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.INP,\n state: relatedEvents.length > 0 ? 'informative' : 'pass',\n ...partialModel,\n relatedEvents,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): DOMSizeInsightModel {\n const isWithinContext = (event: Types.Events.Event): boolean => Helpers.Timing.eventIsInBounds(event, context.bounds);\n\n const mainTid = context.navigation?.tid;\n\n const largeLayoutUpdates: Types.Events.Layout[] = [];\n const largeStyleRecalcs: Types.Events.UpdateLayoutTree[] = [];\n\n const threads = Handlers.Threads.threadsInRenderer(parsedTrace.Renderer, parsedTrace.AuctionWorklets);\n for (const thread of threads) {\n if (thread.type !== Handlers.Threads.ThreadType.MAIN_THREAD) {\n continue;\n }\n\n if (mainTid === undefined) {\n // We won't have a specific thread ID to reference if the context does not have a navigation.\n // In this case, we'll just filter out any OOPIFs threads.\n if (!thread.processIsOnMainFrame) {\n continue;\n }\n } else if (thread.tid !== mainTid) {\n continue;\n }\n\n const rendererThread = parsedTrace.Renderer.processes.get(thread.pid)?.threads.get(thread.tid);\n if (!rendererThread) {\n continue;\n }\n\n const {entries, layoutEvents, updateLayoutTreeEvents} = rendererThread;\n if (!entries.length) {\n continue;\n }\n\n const first = entries[0];\n const last = entries[entries.length - 1];\n const timeRange =\n Helpers.Timing.traceWindowFromMicroSeconds(first.ts, Types.Timing.Micro(last.ts + (last.dur ?? 0)));\n if (!Helpers.Timing.boundsIncludeTimeRange({timeRange, bounds: context.bounds})) {\n continue;\n }\n\n for (const event of layoutEvents) {\n if (event.dur < DOM_SIZE_DURATION_THRESHOLD || !isWithinContext(event)) {\n continue;\n }\n\n const {dirtyObjects} = event.args.beginData;\n if (dirtyObjects > LAYOUT_OBJECTS_THRESHOLD) {\n largeLayoutUpdates.push(event);\n }\n }\n\n for (const event of updateLayoutTreeEvents) {\n if (event.dur < DOM_SIZE_DURATION_THRESHOLD || !isWithinContext(event)) {\n continue;\n }\n\n const {elementCount} = event.args;\n if (elementCount > STYLE_RECALC_ELEMENTS_THRESHOLD) {\n largeStyleRecalcs.push(event);\n }\n }\n }\n\n const largeUpdates: DOMSizeInsightModel['largeUpdates'] = [\n ...largeLayoutUpdates.map(event => {\n const duration = (event.dur / 1000) as Types.Timing.Milli;\n const size = event.args.beginData.dirtyObjects;\n const label = i18nString(UIStrings.largeLayout, {PH1: size});\n return {label, duration, size, event};\n }),\n ...largeStyleRecalcs.map(event => {\n const duration = (event.dur / 1000) as Types.Timing.Milli;\n const size = event.args.elementCount;\n const label = i18nString(UIStrings.largeStyleRecalc, {PH1: size});\n return {label, duration, size, event};\n }),\n ].sort((a, b) => b.duration - a.duration).slice(0, 5);\n\n const domStatsEvents = parsedTrace.DOMStats.domStatsByFrameId.get(context.frameId)?.filter(isWithinContext) ?? [];\n let maxDOMStats: Types.Events.DOMStats|undefined;\n for (const domStats of domStatsEvents) {\n // While recording a cross-origin navigation, there can be overlapping dom stats from before & after\n // the navigation which share a frameId. In this case we should also ensure the pid matches up with\n // the navigation we care about (i.e. from after the navigation event).\n const navigationPid = context.navigation?.pid;\n if (navigationPid && domStats.pid !== navigationPid) {\n continue;\n }\n\n if (!maxDOMStats || domStats.args.data.totalElements > maxDOMStats.args.data.totalElements) {\n maxDOMStats = domStats;\n }\n }\n\n return finalize({\n largeLayoutUpdates,\n largeStyleRecalcs,\n largeUpdates,\n maxDOMStats,\n });\n}\n"]}
1
+ {"version":3,"file":"DOMSize.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/DOMSize.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 type * as Common from '../../../core/common/common.js';\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 type PartialInsightModel,\n} from './types.js';\n\nexport const UIStrings = {\n /**\n * @description Title of an insight that recommends reducing the size of the DOM tree as a means to improve page responsiveness. \"DOM\" is an acronym and should not be translated.\n */\n title: 'Optimize DOM size',\n /**\n * @description Description of an insight that recommends reducing the size of the DOM tree as a means to improve page responsiveness. \"DOM\" is an acronym and should not be translated. \"layout reflows\" are when the browser will recompute the layout of content on the page.\n */\n description:\n 'A large DOM can increase the duration of style calculations and layout reflows, impacting page responsiveness. A large DOM will also increase memory usage. [Learn how to avoid an excessive DOM size](https://developer.chrome.com/docs/lighthouse/performance/dom-size/).',\n /**\n * @description Header for a column containing the names of statistics as opposed to the actual statistic values.\n */\n statistic: 'Statistic',\n /**\n * @description Header for a column containing the value of a statistic.\n */\n value: 'Value',\n /**\n * @description Header for a column containing the page element related to a statistic.\n */\n element: 'Element',\n /**\n * @description Label for a value representing the total number of elements on the page.\n */\n totalElements: 'Total elements',\n /**\n * @description Label for a value representing the maximum depth of the Document Object Model (DOM). \"DOM\" is a acronym and should not be translated.\n */\n maxDOMDepth: 'DOM depth',\n /**\n * @description Label for a value representing the maximum number of child elements of any parent element on the page.\n */\n maxChildren: 'Most children',\n /**\n * @description Text for a section.\n */\n topUpdatesDescription:\n 'These are the largest layout and style recalculation events. Their performance impact may be reduced by making the DOM simpler.',\n /**\n *@description Label used for a time duration.\n */\n duration: 'Duration',\n /**\n * @description Message displayed in a table detailing how big a layout (rendering) is.\n * @example {134} PH1\n */\n largeLayout: 'Layout ({PH1} objects)',\n /**\n * @description Message displayed in a table detailing how big a style recalculation (rendering) is.\n * @example {134} PH1\n */\n largeStyleRecalc: 'Style recalculation ({PH1} elements)',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/DOMSize.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\nconst DOM_SIZE_DURATION_THRESHOLD = Helpers.Timing.milliToMicro(Types.Timing.Milli(40));\n\n// These thresholds were selected to maximize the number of long (>40ms) events above\n// the threshold while maximizing the number of short (<40ms) events below the threshold.\n// See go/rpp-dom-size-thresholds for the analysis that produced these thresholds.\nconst LAYOUT_OBJECTS_THRESHOLD = 100;\nconst STYLE_RECALC_ELEMENTS_THRESHOLD = 300;\n\nexport type DOMSizeInsightModel = InsightModel<typeof UIStrings, {\n largeLayoutUpdates: Types.Events.Layout[],\n largeStyleRecalcs: Types.Events.UpdateLayoutTree[],\n largeUpdates: Array<\n {label: Common.UIString.LocalizedString, duration: Types.Timing.Milli, size: number, event: Types.Events.Event}>,\n maxDOMStats?: Types.Events.DOMStats,\n}>;\n\nfunction finalize(partialModel: PartialInsightModel<DOMSizeInsightModel>): DOMSizeInsightModel {\n const relatedEvents = [...partialModel.largeLayoutUpdates, ...partialModel.largeStyleRecalcs];\n return {\n insightKey: InsightKeys.DOM_SIZE,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.INP,\n state: relatedEvents.length > 0 ? 'informative' : 'pass',\n ...partialModel,\n relatedEvents,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): DOMSizeInsightModel {\n const isWithinContext = (event: Types.Events.Event): boolean => Helpers.Timing.eventIsInBounds(event, context.bounds);\n\n const mainTid = context.navigation?.tid;\n\n const largeLayoutUpdates: Types.Events.Layout[] = [];\n const largeStyleRecalcs: Types.Events.UpdateLayoutTree[] = [];\n\n const threads = Handlers.Threads.threadsInRenderer(parsedTrace.Renderer, parsedTrace.AuctionWorklets);\n for (const thread of threads) {\n if (thread.type !== Handlers.Threads.ThreadType.MAIN_THREAD) {\n continue;\n }\n\n if (mainTid === undefined) {\n // We won't have a specific thread ID to reference if the context does not have a navigation.\n // In this case, we'll just filter out any OOPIFs threads.\n if (!thread.processIsOnMainFrame) {\n continue;\n }\n } else if (thread.tid !== mainTid) {\n continue;\n }\n\n const rendererThread = parsedTrace.Renderer.processes.get(thread.pid)?.threads.get(thread.tid);\n if (!rendererThread) {\n continue;\n }\n\n const {entries, layoutEvents, updateLayoutTreeEvents} = rendererThread;\n if (!entries.length) {\n continue;\n }\n\n const first = entries[0];\n const last = entries[entries.length - 1];\n const timeRange =\n Helpers.Timing.traceWindowFromMicroSeconds(first.ts, Types.Timing.Micro(last.ts + (last.dur ?? 0)));\n if (!Helpers.Timing.boundsIncludeTimeRange({timeRange, bounds: context.bounds})) {\n continue;\n }\n\n for (const event of layoutEvents) {\n if (event.dur < DOM_SIZE_DURATION_THRESHOLD || !isWithinContext(event)) {\n continue;\n }\n\n const {dirtyObjects} = event.args.beginData;\n if (dirtyObjects > LAYOUT_OBJECTS_THRESHOLD) {\n largeLayoutUpdates.push(event);\n }\n }\n\n for (const event of updateLayoutTreeEvents) {\n if (event.dur < DOM_SIZE_DURATION_THRESHOLD || !isWithinContext(event)) {\n continue;\n }\n\n const {elementCount} = event.args;\n if (elementCount > STYLE_RECALC_ELEMENTS_THRESHOLD) {\n largeStyleRecalcs.push(event);\n }\n }\n }\n\n const largeUpdates: DOMSizeInsightModel['largeUpdates'] = [\n ...largeLayoutUpdates.map(event => {\n const duration = (event.dur / 1000) as Types.Timing.Milli;\n const size = event.args.beginData.dirtyObjects;\n const label = i18nString(UIStrings.largeLayout, {PH1: size});\n return {label, duration, size, event};\n }),\n ...largeStyleRecalcs.map(event => {\n const duration = (event.dur / 1000) as Types.Timing.Milli;\n const size = event.args.elementCount;\n const label = i18nString(UIStrings.largeStyleRecalc, {PH1: size});\n return {label, duration, size, event};\n }),\n ].sort((a, b) => b.duration - a.duration).slice(0, 5);\n\n const domStatsEvents = parsedTrace.DOMStats.domStatsByFrameId.get(context.frameId)?.filter(isWithinContext) ?? [];\n let maxDOMStats: Types.Events.DOMStats|undefined;\n for (const domStats of domStatsEvents) {\n // While recording a cross-origin navigation, there can be overlapping dom stats from before & after\n // the navigation which share a frameId. In this case we should also ensure the pid matches up with\n // the navigation we care about (i.e. from after the navigation event).\n const navigationPid = context.navigation?.pid;\n if (navigationPid && domStats.pid !== navigationPid) {\n continue;\n }\n\n if (!maxDOMStats || domStats.args.data.totalElements > maxDOMStats.args.data.totalElements) {\n maxDOMStats = domStats;\n }\n }\n\n return finalize({\n largeLayoutUpdates,\n largeStyleRecalcs,\n largeUpdates,\n maxDOMStats,\n });\n}\n\nexport function createOverlays(model: DOMSizeInsightModel): Types.Overlays.Overlay[] {\n const entries = [...model.largeStyleRecalcs, ...model.largeLayoutUpdates];\n return entries.map(entry => ({\n type: 'ENTRY_OUTLINE',\n entry,\n outlineReason: 'ERROR',\n }));\n}\n"]}
@@ -63,3 +63,4 @@ export type DocumentLatencyInsightModel = InsightModel<typeof UIStrings, {
63
63
  };
64
64
  }>;
65
65
  export declare function generateInsight(parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): DocumentLatencyInsightModel;
66
+ export declare function createOverlays(model: DocumentLatencyInsightModel): Types.Overlays.Overlay[];
@@ -212,4 +212,46 @@ export function generateInsight(parsedTrace, context) {
212
212
  wastedBytes: uncompressedResponseBytes,
213
213
  });
214
214
  }
215
+ export function createOverlays(model) {
216
+ if (!model.data?.documentRequest) {
217
+ return [];
218
+ }
219
+ const overlays = [];
220
+ const event = model.data.documentRequest;
221
+ const redirectDurationMicro = Helpers.Timing.milliToMicro(model.data.redirectDuration);
222
+ const sections = [];
223
+ if (model.data.redirectDuration) {
224
+ const bounds = Helpers.Timing.traceWindowFromMicroSeconds(event.ts, (event.ts + redirectDurationMicro));
225
+ sections.push({ bounds, label: i18nString(UIStrings.redirectsLabel), showDuration: true });
226
+ overlays.push({ type: 'CANDY_STRIPED_TIME_RANGE', bounds, entry: event });
227
+ }
228
+ if (!model.data.checklist.serverResponseIsFast.value) {
229
+ const serverResponseTimeMicro = Helpers.Timing.milliToMicro(model.data.serverResponseTime);
230
+ // NOTE: NetworkRequestHandlers never makes a synthetic network request event if `timing` is missing.
231
+ const sendEnd = event.args.data.timing?.sendEnd ?? Types.Timing.Milli(0);
232
+ const sendEndMicro = Helpers.Timing.milliToMicro(sendEnd);
233
+ const bounds = Helpers.Timing.traceWindowFromMicroSeconds(sendEndMicro, (sendEndMicro + serverResponseTimeMicro));
234
+ sections.push({ bounds, label: i18nString(UIStrings.serverResponseTimeLabel), showDuration: true });
235
+ }
236
+ if (model.data.uncompressedResponseBytes) {
237
+ const bounds = Helpers.Timing.traceWindowFromMicroSeconds(event.args.data.syntheticData.downloadStart, (event.args.data.syntheticData.downloadStart + event.args.data.syntheticData.download));
238
+ sections.push({ bounds, label: i18nString(UIStrings.uncompressedDownload), showDuration: true });
239
+ overlays.push({ type: 'CANDY_STRIPED_TIME_RANGE', bounds, entry: event });
240
+ }
241
+ if (sections.length) {
242
+ overlays.push({
243
+ type: 'TIMESPAN_BREAKDOWN',
244
+ sections,
245
+ entry: model.data.documentRequest,
246
+ // Always render below because the document request is guaranteed to be
247
+ // the first request in the network track.
248
+ renderLocation: 'BELOW_EVENT',
249
+ });
250
+ }
251
+ overlays.push({
252
+ type: 'ENTRY_SELECTED',
253
+ entry: model.data.documentRequest,
254
+ });
255
+ return overlays;
256
+ }
215
257
  //# sourceMappingURL=DocumentLatency.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DocumentLatency.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/DocumentLatency.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 * as Types from '../types/types.js';\n\nimport {isRequestCompressed} from './Common.js';\nimport {\n type Checklist,\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 a breakdown for how long it took to download the main document.\n */\n title: 'Document request latency',\n /**\n *@description Description of an insight that provides a breakdown for how long it took to download the main document.\n */\n description:\n 'Your first network request is the most important. Reduce its latency by avoiding redirects, ensuring a fast server response, and enabling text compression.',\n /**\n * @description Text to tell the user that the document request does not have redirects.\n */\n passingRedirects: 'Avoids redirects',\n /**\n * @description Text to tell the user that the document request had redirects.\n * @example {3} PH1\n * @example {1000 ms} PH2\n */\n failedRedirects: 'Had redirects ({PH1} redirects, +{PH2})',\n /**\n * @description Text to tell the user that the time starting the document request to when the server started responding is acceptable.\n * @example {600 ms} PH1\n */\n passingServerResponseTime: 'Server responds quickly (observed {PH1})',\n /**\n * @description Text to tell the user that the time starting the document request to when the server started responding is not acceptable.\n * @example {601 ms} PH1\n */\n failedServerResponseTime: 'Server responded slowly (observed {PH1})',\n /**\n * @description Text to tell the user that text compression (like gzip) was applied.\n */\n passingTextCompression: 'Applies text compression',\n /**\n * @description Text to tell the user that text compression (like gzip) was not applied.\n */\n failedTextCompression: 'No compression applied',\n /**\n * @description Text for a label describing a network request event as having redirects.\n */\n redirectsLabel: 'Redirects',\n /**\n * @description Text for a label describing a network request event as taking too long to start delivery by the server.\n */\n serverResponseTimeLabel: 'Server response time',\n /**\n * @description Text for a label describing a network request event as taking longer to download because it wasn't compressed.\n */\n uncompressedDownload: 'Uncompressed download',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/DocumentLatency.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\n// Due to the way that DevTools throttling works we cannot see if server response took less than ~570ms.\n// We set our failure threshold to 600ms to avoid those false positives but we want devs to shoot for 100ms.\nconst TOO_SLOW_THRESHOLD_MS = 600;\nconst TARGET_MS = 100;\n\n// Threshold for compression savings.\nconst IGNORE_THRESHOLD_IN_BYTES = 1400;\n\nexport function isDocumentLatency(x: InsightModel): x is DocumentLatencyInsightModel {\n return x.insightKey === 'DocumentLatency';\n}\n\nexport type DocumentLatencyInsightModel = InsightModel<typeof UIStrings, {\n data?: {\n serverResponseTime: Types.Timing.Milli,\n redirectDuration: Types.Timing.Milli,\n uncompressedResponseBytes: number,\n checklist: Checklist<'noRedirects'|'serverResponseIsFast'|'usesCompression'>,\n documentRequest?: Types.Events.SyntheticNetworkRequest,\n },\n}>;\n\nfunction getServerResponseTime(\n request: Types.Events.SyntheticNetworkRequest, context: InsightSetContext): Types.Timing.Milli|null {\n // Prefer the value as given by the Lantern provider.\n // For PSI, Lighthouse uses this to set a better value for the server response\n // time. For technical reasons, in Lightrider we do not have `sendEnd` timing\n // values. See Lighthouse's `asLanternNetworkRequest` function for more.\n const lanternRequest = context.navigation && context.lantern?.requests.find(r => r.rawRequest === request);\n if (lanternRequest?.serverResponseTime !== undefined) {\n return lanternRequest.serverResponseTime as Types.Timing.Milli;\n }\n\n const timing = request.args.data.timing;\n if (!timing) {\n return null;\n }\n\n const ms = Helpers.Timing.microToMilli(request.args.data.syntheticData.waiting);\n return Math.round(ms) as Types.Timing.Milli;\n}\n\nfunction getCompressionSavings(request: Types.Events.SyntheticNetworkRequest): number {\n const isCompressed = isRequestCompressed(request);\n if (isCompressed) {\n return 0;\n }\n\n // We don't know how many bytes this asset used on the network, but we can guess it was\n // roughly the size of the content gzipped.\n // See https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/optimize-encoding-and-transfer for specific CSS/Script examples\n // See https://discuss.httparchive.org/t/file-size-and-compression-savings/145 for fallback multipliers\n // See https://letstalkaboutwebperf.com/en/gzip-brotli-server-config/ for MIME types to compress\n const originalSize = request.args.data.decodedBodyLength;\n let estimatedSavings = 0;\n switch (request.args.data.mimeType) {\n case 'text/css':\n // Stylesheets tend to compress extremely well.\n estimatedSavings = Math.round(originalSize * 0.8);\n break;\n case 'text/html':\n case 'text/javascript':\n // Scripts and HTML compress fairly well too.\n estimatedSavings = Math.round(originalSize * 0.67);\n break;\n case 'text/plain':\n case 'text/xml':\n case 'text/x-component':\n case 'application/javascript':\n case 'application/json':\n case 'application/manifest+json':\n case 'application/vnd.api+json':\n case 'application/xml':\n case 'application/xhtml+xml':\n case 'application/rss+xml':\n case 'application/atom+xml':\n case 'application/vnd.ms-fontobject':\n case 'application/x-font-ttf':\n case 'application/x-font-opentype':\n case 'application/x-font-truetype':\n case 'image/svg+xml':\n case 'image/x-icon':\n case 'image/vnd.microsoft.icon':\n case 'font/ttf':\n case 'font/eot':\n case 'font/otf':\n case 'font/opentype':\n // Use the average savings in HTTPArchive.\n estimatedSavings = Math.round(originalSize * 0.5);\n break;\n default: // Any other MIME types are likely already compressed.\n }\n // Check if the estimated savings are greater than the byte ignore threshold.\n // Note that the estimated gzip savings are always more than 10%, so there is\n // no percent threshold.\n return estimatedSavings < IGNORE_THRESHOLD_IN_BYTES ? 0 : estimatedSavings;\n}\n\nfunction finalize(partialModel: PartialInsightModel<DocumentLatencyInsightModel>): DocumentLatencyInsightModel {\n let hasFailure = false;\n if (partialModel.data) {\n hasFailure = !partialModel.data.checklist.usesCompression.value ||\n !partialModel.data.checklist.serverResponseIsFast.value || !partialModel.data.checklist.noRedirects.value;\n }\n\n return {\n insightKey: InsightKeys.DOCUMENT_LATENCY,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.ALL,\n state: hasFailure ? 'fail' : 'pass',\n ...partialModel,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): DocumentLatencyInsightModel {\n if (!context.navigation) {\n return finalize({});\n }\n\n const documentRequest = parsedTrace.NetworkRequests.byId.get(context.navigationId);\n if (!documentRequest) {\n return finalize({warnings: [InsightWarning.NO_DOCUMENT_REQUEST]});\n }\n\n const serverResponseTime = getServerResponseTime(documentRequest, context);\n if (serverResponseTime === null) {\n throw new Error('missing document request timing');\n }\n\n const serverResponseTooSlow = serverResponseTime > TOO_SLOW_THRESHOLD_MS;\n\n let overallSavingsMs = 0;\n if (serverResponseTime > TOO_SLOW_THRESHOLD_MS) {\n overallSavingsMs = Math.max(serverResponseTime - TARGET_MS, 0);\n }\n\n const redirectDuration = Math.round(documentRequest.args.data.syntheticData.redirectionDuration / 1000);\n overallSavingsMs += redirectDuration;\n\n const metricSavings = {\n FCP: overallSavingsMs as Types.Timing.Milli,\n LCP: overallSavingsMs as Types.Timing.Milli,\n };\n\n const uncompressedResponseBytes = getCompressionSavings(documentRequest);\n\n const noRedirects = redirectDuration === 0;\n const serverResponseIsFast = !serverResponseTooSlow;\n const usesCompression = uncompressedResponseBytes === 0;\n\n return finalize({\n relatedEvents: [documentRequest],\n data: {\n serverResponseTime,\n redirectDuration: Types.Timing.Milli(redirectDuration),\n uncompressedResponseBytes,\n documentRequest,\n checklist: {\n noRedirects: {\n label: noRedirects ? i18nString(UIStrings.passingRedirects) : i18nString(UIStrings.failedRedirects, {\n PH1: documentRequest.args.data.redirects.length,\n PH2: i18n.TimeUtilities.millisToString(redirectDuration),\n }),\n value: noRedirects\n },\n serverResponseIsFast: {\n label: serverResponseIsFast ?\n i18nString(\n UIStrings.passingServerResponseTime, {PH1: i18n.TimeUtilities.millisToString(serverResponseTime)}) :\n i18nString(\n UIStrings.failedServerResponseTime, {PH1: i18n.TimeUtilities.millisToString(serverResponseTime)}),\n value: serverResponseIsFast\n },\n usesCompression: {\n label: usesCompression ? i18nString(UIStrings.passingTextCompression) :\n i18nString(UIStrings.failedTextCompression),\n value: usesCompression\n },\n },\n },\n metricSavings,\n wastedBytes: uncompressedResponseBytes,\n });\n}\n"]}
1
+ {"version":3,"file":"DocumentLatency.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/DocumentLatency.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 * as Types from '../types/types.js';\n\nimport {isRequestCompressed} from './Common.js';\nimport {\n type Checklist,\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 a breakdown for how long it took to download the main document.\n */\n title: 'Document request latency',\n /**\n *@description Description of an insight that provides a breakdown for how long it took to download the main document.\n */\n description:\n 'Your first network request is the most important. Reduce its latency by avoiding redirects, ensuring a fast server response, and enabling text compression.',\n /**\n * @description Text to tell the user that the document request does not have redirects.\n */\n passingRedirects: 'Avoids redirects',\n /**\n * @description Text to tell the user that the document request had redirects.\n * @example {3} PH1\n * @example {1000 ms} PH2\n */\n failedRedirects: 'Had redirects ({PH1} redirects, +{PH2})',\n /**\n * @description Text to tell the user that the time starting the document request to when the server started responding is acceptable.\n * @example {600 ms} PH1\n */\n passingServerResponseTime: 'Server responds quickly (observed {PH1})',\n /**\n * @description Text to tell the user that the time starting the document request to when the server started responding is not acceptable.\n * @example {601 ms} PH1\n */\n failedServerResponseTime: 'Server responded slowly (observed {PH1})',\n /**\n * @description Text to tell the user that text compression (like gzip) was applied.\n */\n passingTextCompression: 'Applies text compression',\n /**\n * @description Text to tell the user that text compression (like gzip) was not applied.\n */\n failedTextCompression: 'No compression applied',\n /**\n * @description Text for a label describing a network request event as having redirects.\n */\n redirectsLabel: 'Redirects',\n /**\n * @description Text for a label describing a network request event as taking too long to start delivery by the server.\n */\n serverResponseTimeLabel: 'Server response time',\n /**\n * @description Text for a label describing a network request event as taking longer to download because it wasn't compressed.\n */\n uncompressedDownload: 'Uncompressed download',\n} as const;\n\nconst str_ = i18n.i18n.registerUIStrings('models/trace/insights/DocumentLatency.ts', UIStrings);\nexport const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);\n\n// Due to the way that DevTools throttling works we cannot see if server response took less than ~570ms.\n// We set our failure threshold to 600ms to avoid those false positives but we want devs to shoot for 100ms.\nconst TOO_SLOW_THRESHOLD_MS = 600;\nconst TARGET_MS = 100;\n\n// Threshold for compression savings.\nconst IGNORE_THRESHOLD_IN_BYTES = 1400;\n\nexport function isDocumentLatency(x: InsightModel): x is DocumentLatencyInsightModel {\n return x.insightKey === 'DocumentLatency';\n}\n\nexport type DocumentLatencyInsightModel = InsightModel<typeof UIStrings, {\n data?: {\n serverResponseTime: Types.Timing.Milli,\n redirectDuration: Types.Timing.Milli,\n uncompressedResponseBytes: number,\n checklist: Checklist<'noRedirects'|'serverResponseIsFast'|'usesCompression'>,\n documentRequest?: Types.Events.SyntheticNetworkRequest,\n },\n}>;\n\nfunction getServerResponseTime(\n request: Types.Events.SyntheticNetworkRequest, context: InsightSetContext): Types.Timing.Milli|null {\n // Prefer the value as given by the Lantern provider.\n // For PSI, Lighthouse uses this to set a better value for the server response\n // time. For technical reasons, in Lightrider we do not have `sendEnd` timing\n // values. See Lighthouse's `asLanternNetworkRequest` function for more.\n const lanternRequest = context.navigation && context.lantern?.requests.find(r => r.rawRequest === request);\n if (lanternRequest?.serverResponseTime !== undefined) {\n return lanternRequest.serverResponseTime as Types.Timing.Milli;\n }\n\n const timing = request.args.data.timing;\n if (!timing) {\n return null;\n }\n\n const ms = Helpers.Timing.microToMilli(request.args.data.syntheticData.waiting);\n return Math.round(ms) as Types.Timing.Milli;\n}\n\nfunction getCompressionSavings(request: Types.Events.SyntheticNetworkRequest): number {\n const isCompressed = isRequestCompressed(request);\n if (isCompressed) {\n return 0;\n }\n\n // We don't know how many bytes this asset used on the network, but we can guess it was\n // roughly the size of the content gzipped.\n // See https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/optimize-encoding-and-transfer for specific CSS/Script examples\n // See https://discuss.httparchive.org/t/file-size-and-compression-savings/145 for fallback multipliers\n // See https://letstalkaboutwebperf.com/en/gzip-brotli-server-config/ for MIME types to compress\n const originalSize = request.args.data.decodedBodyLength;\n let estimatedSavings = 0;\n switch (request.args.data.mimeType) {\n case 'text/css':\n // Stylesheets tend to compress extremely well.\n estimatedSavings = Math.round(originalSize * 0.8);\n break;\n case 'text/html':\n case 'text/javascript':\n // Scripts and HTML compress fairly well too.\n estimatedSavings = Math.round(originalSize * 0.67);\n break;\n case 'text/plain':\n case 'text/xml':\n case 'text/x-component':\n case 'application/javascript':\n case 'application/json':\n case 'application/manifest+json':\n case 'application/vnd.api+json':\n case 'application/xml':\n case 'application/xhtml+xml':\n case 'application/rss+xml':\n case 'application/atom+xml':\n case 'application/vnd.ms-fontobject':\n case 'application/x-font-ttf':\n case 'application/x-font-opentype':\n case 'application/x-font-truetype':\n case 'image/svg+xml':\n case 'image/x-icon':\n case 'image/vnd.microsoft.icon':\n case 'font/ttf':\n case 'font/eot':\n case 'font/otf':\n case 'font/opentype':\n // Use the average savings in HTTPArchive.\n estimatedSavings = Math.round(originalSize * 0.5);\n break;\n default: // Any other MIME types are likely already compressed.\n }\n // Check if the estimated savings are greater than the byte ignore threshold.\n // Note that the estimated gzip savings are always more than 10%, so there is\n // no percent threshold.\n return estimatedSavings < IGNORE_THRESHOLD_IN_BYTES ? 0 : estimatedSavings;\n}\n\nfunction finalize(partialModel: PartialInsightModel<DocumentLatencyInsightModel>): DocumentLatencyInsightModel {\n let hasFailure = false;\n if (partialModel.data) {\n hasFailure = !partialModel.data.checklist.usesCompression.value ||\n !partialModel.data.checklist.serverResponseIsFast.value || !partialModel.data.checklist.noRedirects.value;\n }\n\n return {\n insightKey: InsightKeys.DOCUMENT_LATENCY,\n strings: UIStrings,\n title: i18nString(UIStrings.title),\n description: i18nString(UIStrings.description),\n category: InsightCategory.ALL,\n state: hasFailure ? 'fail' : 'pass',\n ...partialModel,\n };\n}\n\nexport function generateInsight(\n parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): DocumentLatencyInsightModel {\n if (!context.navigation) {\n return finalize({});\n }\n\n const documentRequest = parsedTrace.NetworkRequests.byId.get(context.navigationId);\n if (!documentRequest) {\n return finalize({warnings: [InsightWarning.NO_DOCUMENT_REQUEST]});\n }\n\n const serverResponseTime = getServerResponseTime(documentRequest, context);\n if (serverResponseTime === null) {\n throw new Error('missing document request timing');\n }\n\n const serverResponseTooSlow = serverResponseTime > TOO_SLOW_THRESHOLD_MS;\n\n let overallSavingsMs = 0;\n if (serverResponseTime > TOO_SLOW_THRESHOLD_MS) {\n overallSavingsMs = Math.max(serverResponseTime - TARGET_MS, 0);\n }\n\n const redirectDuration = Math.round(documentRequest.args.data.syntheticData.redirectionDuration / 1000);\n overallSavingsMs += redirectDuration;\n\n const metricSavings = {\n FCP: overallSavingsMs as Types.Timing.Milli,\n LCP: overallSavingsMs as Types.Timing.Milli,\n };\n\n const uncompressedResponseBytes = getCompressionSavings(documentRequest);\n\n const noRedirects = redirectDuration === 0;\n const serverResponseIsFast = !serverResponseTooSlow;\n const usesCompression = uncompressedResponseBytes === 0;\n\n return finalize({\n relatedEvents: [documentRequest],\n data: {\n serverResponseTime,\n redirectDuration: Types.Timing.Milli(redirectDuration),\n uncompressedResponseBytes,\n documentRequest,\n checklist: {\n noRedirects: {\n label: noRedirects ? i18nString(UIStrings.passingRedirects) : i18nString(UIStrings.failedRedirects, {\n PH1: documentRequest.args.data.redirects.length,\n PH2: i18n.TimeUtilities.millisToString(redirectDuration),\n }),\n value: noRedirects\n },\n serverResponseIsFast: {\n label: serverResponseIsFast ?\n i18nString(\n UIStrings.passingServerResponseTime, {PH1: i18n.TimeUtilities.millisToString(serverResponseTime)}) :\n i18nString(\n UIStrings.failedServerResponseTime, {PH1: i18n.TimeUtilities.millisToString(serverResponseTime)}),\n value: serverResponseIsFast\n },\n usesCompression: {\n label: usesCompression ? i18nString(UIStrings.passingTextCompression) :\n i18nString(UIStrings.failedTextCompression),\n value: usesCompression\n },\n },\n },\n metricSavings,\n wastedBytes: uncompressedResponseBytes,\n });\n}\n\nexport function createOverlays(model: DocumentLatencyInsightModel): Types.Overlays.Overlay[] {\n if (!model.data?.documentRequest) {\n return [];\n }\n\n const overlays: Types.Overlays.Overlay[] = [];\n const event = model.data.documentRequest;\n const redirectDurationMicro = Helpers.Timing.milliToMicro(model.data.redirectDuration);\n\n const sections = [];\n if (model.data.redirectDuration) {\n const bounds = Helpers.Timing.traceWindowFromMicroSeconds(\n event.ts,\n (event.ts + redirectDurationMicro) as Types.Timing.Micro,\n );\n sections.push({bounds, label: i18nString(UIStrings.redirectsLabel), showDuration: true});\n overlays.push({type: 'CANDY_STRIPED_TIME_RANGE', bounds, entry: event});\n }\n if (!model.data.checklist.serverResponseIsFast.value) {\n const serverResponseTimeMicro = Helpers.Timing.milliToMicro(model.data.serverResponseTime);\n // NOTE: NetworkRequestHandlers never makes a synthetic network request event if `timing` is missing.\n const sendEnd = event.args.data.timing?.sendEnd ?? Types.Timing.Milli(0);\n const sendEndMicro = Helpers.Timing.milliToMicro(sendEnd);\n const bounds = Helpers.Timing.traceWindowFromMicroSeconds(\n sendEndMicro,\n (sendEndMicro + serverResponseTimeMicro) as Types.Timing.Micro,\n );\n sections.push({bounds, label: i18nString(UIStrings.serverResponseTimeLabel), showDuration: true});\n }\n if (model.data.uncompressedResponseBytes) {\n const bounds = Helpers.Timing.traceWindowFromMicroSeconds(\n event.args.data.syntheticData.downloadStart,\n (event.args.data.syntheticData.downloadStart + event.args.data.syntheticData.download) as Types.Timing.Micro,\n );\n sections.push({bounds, label: i18nString(UIStrings.uncompressedDownload), showDuration: true});\n overlays.push({type: 'CANDY_STRIPED_TIME_RANGE', bounds, entry: event});\n }\n\n if (sections.length) {\n overlays.push({\n type: 'TIMESPAN_BREAKDOWN',\n sections,\n entry: model.data.documentRequest,\n // Always render below because the document request is guaranteed to be\n // the first request in the network track.\n renderLocation: 'BELOW_EVENT',\n });\n }\n overlays.push({\n type: 'ENTRY_SELECTED',\n entry: model.data.documentRequest,\n });\n\n return overlays;\n}\n"]}
@@ -1,5 +1,6 @@
1
1
  import * as Extras from '../extras/extras.js';
2
2
  import type * as Handlers from '../handlers/handlers.js';
3
+ import type * as Types from '../types/types.js';
3
4
  import { type InsightModel, type InsightSetContext } from './types.js';
4
5
  export declare const UIStrings: {
5
6
  /**
@@ -24,3 +25,4 @@ export type DuplicatedJavaScriptInsightModel = InsightModel<typeof UIStrings, {
24
25
  mainDocumentUrl: string;
25
26
  }>;
26
27
  export declare function generateInsight(parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): DuplicatedJavaScriptInsightModel;
28
+ export declare function createOverlays(model: DuplicatedJavaScriptInsightModel): Types.Overlays.Overlay[];
@@ -78,4 +78,13 @@ export function generateInsight(parsedTrace, context) {
78
78
  wastedBytes: wastedBytesByRequestId.values().reduce((acc, cur) => acc + cur, 0),
79
79
  });
80
80
  }
81
+ export function createOverlays(model) {
82
+ return model.scriptsWithDuplication.map(script => script.request).filter(e => !!e).map(request => {
83
+ return {
84
+ type: 'ENTRY_OUTLINE',
85
+ entry: request,
86
+ outlineReason: 'ERROR',
87
+ };
88
+ });
89
+ }
81
90
  //# sourceMappingURL=DuplicatedJavaScript.js.map