@paulirish/trace_engine 0.0.54 → 0.0.55

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 (187) hide show
  1. package/.tmp/tsbuildinfo/models/trace/extras/polyfills.d.ts +4 -0
  2. package/.tmp/tsbuildinfo/models/trace/extras/polyfills.d.ts.map +1 -0
  3. package/.tmp/tsbuildinfo/tsconfig.tsbuildinfo +1 -1
  4. package/core/platform/MimeType.d.ts +3 -2
  5. package/core/platform/MimeType.js +4 -3
  6. package/core/platform/MimeType.js.map +1 -1
  7. package/generated/protocol.d.ts +115 -16
  8. package/locales/af.json +52 -10
  9. package/locales/am.json +52 -10
  10. package/locales/ar.json +51 -9
  11. package/locales/as.json +52 -10
  12. package/locales/az.json +52 -10
  13. package/locales/be.json +52 -10
  14. package/locales/bg.json +52 -10
  15. package/locales/bn.json +52 -10
  16. package/locales/bs.json +52 -10
  17. package/locales/ca.json +52 -10
  18. package/locales/cs.json +52 -10
  19. package/locales/cy.json +52 -10
  20. package/locales/da.json +52 -10
  21. package/locales/de.json +52 -10
  22. package/locales/el.json +52 -10
  23. package/locales/en-GB.json +52 -10
  24. package/locales/en-US.json +12 -12
  25. package/locales/en-XL.json +12 -12
  26. package/locales/es-419.json +52 -10
  27. package/locales/es.json +50 -8
  28. package/locales/et.json +52 -10
  29. package/locales/eu.json +52 -10
  30. package/locales/fa.json +51 -9
  31. package/locales/fi.json +52 -10
  32. package/locales/fil.json +52 -10
  33. package/locales/fr-CA.json +52 -10
  34. package/locales/fr.json +52 -10
  35. package/locales/gl.json +52 -10
  36. package/locales/gu.json +52 -10
  37. package/locales/he.json +52 -10
  38. package/locales/hi.json +52 -10
  39. package/locales/hr.json +52 -10
  40. package/locales/hu.json +51 -9
  41. package/locales/hy.json +51 -9
  42. package/locales/id.json +52 -10
  43. package/locales/is.json +53 -11
  44. package/locales/it.json +51 -9
  45. package/locales/ja.json +52 -10
  46. package/locales/ka.json +53 -11
  47. package/locales/kk.json +51 -9
  48. package/locales/km.json +52 -10
  49. package/locales/kn.json +52 -10
  50. package/locales/ko.json +52 -10
  51. package/locales/ky.json +51 -9
  52. package/locales/lo.json +52 -10
  53. package/locales/lt.json +52 -10
  54. package/locales/lv.json +51 -9
  55. package/locales/mk.json +52 -10
  56. package/locales/ml.json +53 -11
  57. package/locales/mn.json +52 -10
  58. package/locales/mr.json +52 -10
  59. package/locales/ms.json +52 -10
  60. package/locales/my.json +51 -9
  61. package/locales/ne.json +52 -10
  62. package/locales/nl.json +52 -10
  63. package/locales/no.json +52 -10
  64. package/locales/or.json +53 -11
  65. package/locales/pa.json +53 -11
  66. package/locales/pl.json +51 -9
  67. package/locales/pt-PT.json +52 -10
  68. package/locales/pt.json +52 -10
  69. package/locales/ro.json +52 -10
  70. package/locales/ru.json +53 -11
  71. package/locales/si.json +52 -10
  72. package/locales/sk.json +51 -9
  73. package/locales/sl.json +51 -9
  74. package/locales/sq.json +52 -10
  75. package/locales/sr-Latn.json +52 -10
  76. package/locales/sr.json +52 -10
  77. package/locales/sv.json +52 -10
  78. package/locales/sw.json +51 -9
  79. package/locales/ta.json +52 -10
  80. package/locales/te.json +52 -10
  81. package/locales/th.json +51 -9
  82. package/locales/tr.json +52 -10
  83. package/locales/uk.json +52 -10
  84. package/locales/ur.json +52 -10
  85. package/locales/uz.json +51 -9
  86. package/locales/vi.json +52 -10
  87. package/locales/zh-HK.json +52 -10
  88. package/locales/zh-TW.json +51 -9
  89. package/locales/zh.json +52 -10
  90. package/locales/zu.json +52 -10
  91. package/models/cpu_profile/CPUProfileDataModel.d.ts +4 -2
  92. package/models/cpu_profile/CPUProfileDataModel.js.map +1 -1
  93. package/models/cpu_profile/ProfileTreeModel.d.ts +0 -1
  94. package/models/cpu_profile/ProfileTreeModel.js +0 -2
  95. package/models/cpu_profile/ProfileTreeModel.js.map +1 -1
  96. package/models/trace/LanternComputationData.js +7 -6
  97. package/models/trace/LanternComputationData.js.map +1 -1
  98. package/models/trace/Processor.js +23 -16
  99. package/models/trace/Processor.js.map +1 -1
  100. package/models/trace/extras/extras-tsconfig.json +0 -2
  101. package/models/trace/extras/extras.js.map +1 -1
  102. package/models/trace/handlers/MetaHandler.js +2 -0
  103. package/models/trace/handlers/MetaHandler.js.map +1 -1
  104. package/models/trace/handlers/NetworkRequestsHandler.d.ts +0 -5
  105. package/models/trace/handlers/NetworkRequestsHandler.js +0 -19
  106. package/models/trace/handlers/NetworkRequestsHandler.js.map +1 -1
  107. package/models/trace/handlers/SamplesHandler.js +7 -2
  108. package/models/trace/handlers/SamplesHandler.js.map +1 -1
  109. package/models/trace/handlers/ScriptsHandler.js.map +1 -1
  110. package/models/trace/helpers/SamplesIntegrator.js +8 -13
  111. package/models/trace/helpers/SamplesIntegrator.js.map +1 -1
  112. package/models/trace/helpers/Trace.js +0 -7
  113. package/models/trace/helpers/Trace.js.map +1 -1
  114. package/models/trace/insights/CLSCulprits.d.ts +24 -4
  115. package/models/trace/insights/CLSCulprits.js +30 -11
  116. package/models/trace/insights/CLSCulprits.js.map +1 -1
  117. package/models/trace/insights/DocumentLatency.d.ts +2 -2
  118. package/models/trace/insights/DocumentLatency.js +2 -2
  119. package/models/trace/insights/DocumentLatency.js.map +1 -1
  120. package/models/trace/insights/NetworkDependencyTree.d.ts +31 -5
  121. package/models/trace/insights/NetworkDependencyTree.js +135 -10
  122. package/models/trace/insights/NetworkDependencyTree.js.map +1 -1
  123. package/models/trace/insights/Viewport.d.ts +8 -2
  124. package/models/trace/insights/Viewport.js +16 -1
  125. package/models/trace/insights/Viewport.js.map +1 -1
  126. package/models/trace/lantern/graph/BaseNode.d.ts +5 -2
  127. package/models/trace/lantern/graph/BaseNode.js +8 -5
  128. package/models/trace/lantern/graph/BaseNode.js.map +1 -1
  129. package/models/trace/lantern/graph/PageDependencyGraph.js +46 -3
  130. package/models/trace/lantern/graph/PageDependencyGraph.js.map +1 -1
  131. package/models/trace/lantern/simulation/Simulator.js +1 -1
  132. package/models/trace/lantern/simulation/Simulator.js.map +1 -1
  133. package/models/trace/trace-tsconfig.json +0 -1
  134. package/models/trace/trace.d.ts +1 -2
  135. package/models/trace/trace.js +1 -2
  136. package/models/trace/trace.js.map +1 -1
  137. package/models/trace/types/Extensions.d.ts +6 -1
  138. package/models/trace/types/Extensions.js.map +1 -1
  139. package/models/trace/types/File.d.ts +15 -1
  140. package/models/trace/types/File.js.map +1 -1
  141. package/models/trace/types/TraceEvents.d.ts +7 -4
  142. package/models/trace/types/TraceEvents.js +4 -3
  143. package/models/trace/types/TraceEvents.js.map +1 -1
  144. package/package.json +1 -1
  145. package/core/platform/ServerTiming.d.ts +0 -31
  146. package/core/platform/ServerTiming.js +0 -212
  147. package/core/platform/ServerTiming.js.map +0 -1
  148. package/models/trace/TracingManager.js.map +0 -1
  149. package/models/trace/extras/FetchNodes.d.ts +0 -61
  150. package/models/trace/extras/FetchNodes.js +0 -214
  151. package/models/trace/extras/FetchNodes.js.map +0 -1
  152. package/models/trace/extras/Metadata.d.ts +0 -3
  153. package/models/trace/extras/Metadata.js +0 -71
  154. package/models/trace/extras/Metadata.js.map +0 -1
  155. package/models/trace/extras/TimelineJSProfile.d.ts +0 -13
  156. package/models/trace/extras/TimelineJSProfile.js +0 -55
  157. package/models/trace/extras/TimelineJSProfile.js.map +0 -1
  158. package/models/trace/extras/URLForEntry.d.ts +0 -12
  159. package/models/trace/extras/URLForEntry.js +0 -43
  160. package/models/trace/extras/URLForEntry.js.map +0 -1
  161. package/models/trace/handlers/ServerTimingsHandler.d.ts +0 -9
  162. package/models/trace/handlers/ServerTimingsHandler.js +0 -106
  163. package/models/trace/handlers/ServerTimingsHandler.js.map +0 -1
  164. package/models/trace/insights/CumulativeLayoutShift.d.ts +0 -57
  165. package/models/trace/insights/CumulativeLayoutShift.js +0 -335
  166. package/models/trace/insights/CumulativeLayoutShift.js.map +0 -1
  167. package/models/trace/insights/InsightRunners.d.ts +0 -9
  168. package/models/trace/insights/InsightRunners.js +0 -13
  169. package/models/trace/insights/InsightRunners.js.map +0 -1
  170. package/models/trace/insights/LargestContentfulPaint.d.ts +0 -38
  171. package/models/trace/insights/LargestContentfulPaint.js +0 -113
  172. package/models/trace/insights/LargestContentfulPaint.js.map +0 -1
  173. package/models/trace/insights/ThirdPartyWeb.d.ts +0 -13
  174. package/models/trace/insights/ThirdPartyWeb.js +0 -42
  175. package/models/trace/insights/ThirdPartyWeb.js.map +0 -1
  176. package/models/trace/root-causes/LayoutShift.d.ts +0 -125
  177. package/models/trace/root-causes/LayoutShift.js +0 -519
  178. package/models/trace/root-causes/LayoutShift.js.map +0 -1
  179. package/models/trace/root-causes/RootCauses.d.ts +0 -15
  180. package/models/trace/root-causes/RootCauses.js +0 -12
  181. package/models/trace/root-causes/RootCauses.js.map +0 -1
  182. package/models/trace/root-causes/bundle-tsconfig.json +0 -1
  183. package/models/trace/root-causes/devtools_entrypoint-bundle-typescript-tsconfig.json +0 -42
  184. package/models/trace/root-causes/root-causes-tsconfig.json +0 -55
  185. package/models/trace/root-causes/root-causes.d.ts +0 -1
  186. package/models/trace/root-causes/root-causes.js +0 -5
  187. package/models/trace/root-causes/root-causes.js.map +0 -1
@@ -1,335 +0,0 @@
1
- // Copyright 2024 The Chromium Authors. All rights reserved.
2
- // Use of this source code is governed by a BSD-style license that can be
3
- // found in the LICENSE file.
4
- import * as Platform from '../../../core/platform/platform.js';
5
- import * as Helpers from '../helpers/helpers.js';
6
- import * as Types from '../types/types.js';
7
- export function deps() {
8
- return ['Meta', 'Animations', 'LayoutShifts', 'NetworkRequests'];
9
- }
10
- /**
11
- * Each failure reason is represented by a bit flag. The bit shift operator '<<' is used to define
12
- * which bit corresponds to each failure reason.
13
- * https://source.chromium.org/search?q=f:compositor_animations.h%20%22enum%20FailureReason%22
14
- * @type {{flag: number, failure: AnimationFailureReasons}[]}
15
- */
16
- const ACTIONABLE_FAILURE_REASONS = [
17
- {
18
- flag: 1 << 0,
19
- failure: "ACCELERATED_ANIMATIONS_DISABLED" /* AnimationFailureReasons.ACCELERATED_ANIMATIONS_DISABLED */,
20
- },
21
- {
22
- flag: 1 << 1,
23
- failure: "EFFECT_SUPPRESSED_BY_DEVTOOLS" /* AnimationFailureReasons.EFFECT_SUPPRESSED_BY_DEVTOOLS */,
24
- },
25
- {
26
- flag: 1 << 2,
27
- failure: "INVALID_ANIMATION_OR_EFFECT" /* AnimationFailureReasons.INVALID_ANIMATION_OR_EFFECT */,
28
- },
29
- {
30
- flag: 1 << 3,
31
- failure: "EFFECT_HAS_UNSUPPORTED_TIMING_PARAMS" /* AnimationFailureReasons.EFFECT_HAS_UNSUPPORTED_TIMING_PARAMS */,
32
- },
33
- {
34
- flag: 1 << 4,
35
- failure: "EFFECT_HAS_NON_REPLACE_COMPOSITE_MODE" /* AnimationFailureReasons.EFFECT_HAS_NON_REPLACE_COMPOSITE_MODE */,
36
- },
37
- {
38
- flag: 1 << 5,
39
- failure: "TARGET_HAS_INVALID_COMPOSITING_STATE" /* AnimationFailureReasons.TARGET_HAS_INVALID_COMPOSITING_STATE */,
40
- },
41
- {
42
- flag: 1 << 6,
43
- failure: "TARGET_HAS_INCOMPATIBLE_ANIMATIONS" /* AnimationFailureReasons.TARGET_HAS_INCOMPATIBLE_ANIMATIONS */,
44
- },
45
- {
46
- flag: 1 << 7,
47
- failure: "TARGET_HAS_CSS_OFFSET" /* AnimationFailureReasons.TARGET_HAS_CSS_OFFSET */,
48
- },
49
- // The failure 1 << 8 is marked as obsolete in Blink
50
- {
51
- flag: 1 << 9,
52
- failure: "ANIMATION_AFFECTS_NON_CSS_PROPERTIES" /* AnimationFailureReasons.ANIMATION_AFFECTS_NON_CSS_PROPERTIES */,
53
- },
54
- {
55
- flag: 1 << 10,
56
- failure: "TRANSFORM_RELATED_PROPERTY_CANNOT_BE_ACCELERATED_ON_TARGET" /* AnimationFailureReasons.TRANSFORM_RELATED_PROPERTY_CANNOT_BE_ACCELERATED_ON_TARGET */,
57
- },
58
- {
59
- flag: 1 << 11,
60
- failure: "TRANSFROM_BOX_SIZE_DEPENDENT" /* AnimationFailureReasons.TRANSFROM_BOX_SIZE_DEPENDENT */,
61
- },
62
- {
63
- flag: 1 << 12,
64
- failure: "FILTER_RELATED_PROPERTY_MAY_MOVE_PIXELS" /* AnimationFailureReasons.FILTER_RELATED_PROPERTY_MAY_MOVE_PIXELS */,
65
- },
66
- {
67
- flag: 1 << 13,
68
- failure: "UNSUPPORTED_CSS_PROPERTY" /* AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY */,
69
- },
70
- // The failure 1 << 14 is marked as obsolete in Blink
71
- {
72
- flag: 1 << 15,
73
- failure: "MIXED_KEYFRAME_VALUE_TYPES" /* AnimationFailureReasons.MIXED_KEYFRAME_VALUE_TYPES */,
74
- },
75
- {
76
- flag: 1 << 16,
77
- failure: "TIMELINE_SOURCE_HAS_INVALID_COMPOSITING_STATE" /* AnimationFailureReasons.TIMELINE_SOURCE_HAS_INVALID_COMPOSITING_STATE */,
78
- },
79
- {
80
- flag: 1 << 17,
81
- failure: "ANIMATION_HAS_NO_VISIBLE_CHANGE" /* AnimationFailureReasons.ANIMATION_HAS_NO_VISIBLE_CHANGE */,
82
- },
83
- {
84
- flag: 1 << 18,
85
- failure: "AFFECTS_IMPORTANT_PROPERTY" /* AnimationFailureReasons.AFFECTS_IMPORTANT_PROPERTY */,
86
- },
87
- {
88
- flag: 1 << 19,
89
- failure: "SVG_TARGET_HAS_INDEPENDENT_TRANSFORM_PROPERTY" /* AnimationFailureReasons.SVG_TARGET_HAS_INDEPENDENT_TRANSFORM_PROPERTY */,
90
- },
91
- ];
92
- // 500ms window.
93
- // Use this window to consider events and requests that may have caused a layout shift.
94
- const ROOT_CAUSE_WINDOW = Helpers.Timing.secondsToMicroseconds(Types.Timing.Seconds(0.5));
95
- /**
96
- * Returns if an event happens within the root cause window, before the target event.
97
- * ROOT_CAUSE_WINDOW v target event
98
- * |------------------------|=======================
99
- */
100
- function isInRootCauseWindow(event, targetEvent) {
101
- const eventEnd = event.dur ? event.ts + event.dur : event.ts;
102
- return eventEnd < targetEvent.ts && eventEnd >= targetEvent.ts - ROOT_CAUSE_WINDOW;
103
- }
104
- export function getNonCompositedFailure(animationEvent) {
105
- const failures = [];
106
- const beginEvent = animationEvent.args.data.beginEvent;
107
- const instantEvents = animationEvent.args.data.instantEvents || [];
108
- /**
109
- * Animation events containing composite information are ASYNC_NESTABLE_INSTANT ('n').
110
- * An animation may also contain multiple 'n' events, so we look through those with useful non-composited data.
111
- */
112
- for (const event of instantEvents) {
113
- const failureMask = event.args.data.compositeFailed;
114
- const unsupportedProperties = event.args.data.unsupportedProperties;
115
- if (!failureMask) {
116
- continue;
117
- }
118
- const failureReasons = ACTIONABLE_FAILURE_REASONS.filter(reason => failureMask & reason.flag).map(reason => reason.failure);
119
- const failure = {
120
- name: beginEvent.args.data.displayName,
121
- failureReasons,
122
- unsupportedProperties,
123
- animation: animationEvent,
124
- };
125
- failures.push(failure);
126
- }
127
- return failures;
128
- }
129
- function getNonCompositedFailureRootCauses(animationEvents, prePaintEvents, shiftsByPrePaint, rootCausesByShift) {
130
- const allAnimationFailures = [];
131
- for (const animation of animationEvents) {
132
- /**
133
- * Animation events containing composite information are ASYNC_NESTABLE_INSTANT ('n').
134
- * An animation may also contain multiple 'n' events, so we look through those with useful non-composited data.
135
- */
136
- const failures = getNonCompositedFailure(animation);
137
- if (!failures) {
138
- continue;
139
- }
140
- allAnimationFailures.push(...failures);
141
- const nextPrePaint = getNextEvent(prePaintEvents, animation);
142
- // If no following prePaint, this is not a root cause.
143
- if (!nextPrePaint) {
144
- continue;
145
- }
146
- // If the animation event is outside the ROOT_CAUSE_WINDOW, it could not be a root cause.
147
- if (!isInRootCauseWindow(animation, nextPrePaint)) {
148
- continue;
149
- }
150
- const shifts = shiftsByPrePaint.get(nextPrePaint);
151
- // if no layout shift(s), this is not a root cause.
152
- if (!shifts) {
153
- continue;
154
- }
155
- for (const shift of shifts) {
156
- const rootCausesForShift = rootCausesByShift.get(shift);
157
- if (!rootCausesForShift) {
158
- throw new Error('Unaccounted shift');
159
- }
160
- rootCausesForShift.nonCompositedAnimations.push(...failures);
161
- }
162
- }
163
- return allAnimationFailures;
164
- }
165
- /**
166
- * Given an array of layout shift and PrePaint events, returns a mapping from
167
- * PrePaint events to layout shifts dispatched within it.
168
- */
169
- function getShiftsByPrePaintEvents(layoutShifts, prePaintEvents) {
170
- // Maps from PrePaint events to LayoutShifts that occured in each one.
171
- const shiftsByPrePaint = new Map();
172
- // Associate all shifts to their corresponding PrePaint.
173
- for (const prePaintEvent of prePaintEvents) {
174
- const firstShiftIndex = Platform.ArrayUtilities.nearestIndexFromBeginning(layoutShifts, shift => shift.ts >= prePaintEvent.ts);
175
- if (firstShiftIndex === null) {
176
- // No layout shifts registered after this PrePaint start. Continue.
177
- continue;
178
- }
179
- for (let i = firstShiftIndex; i < layoutShifts.length; i++) {
180
- const shift = layoutShifts[i];
181
- if (shift.ts >= prePaintEvent.ts && shift.ts <= prePaintEvent.ts + prePaintEvent.dur) {
182
- const shiftsInPrePaint = Platform.MapUtilities.getWithDefault(shiftsByPrePaint, prePaintEvent, () => []);
183
- shiftsInPrePaint.push(shift);
184
- }
185
- if (shift.ts > prePaintEvent.ts + prePaintEvent.dur) {
186
- // Reached all layoutShifts of this PrePaint. Break out to continue with the next prePaint event.
187
- break;
188
- }
189
- }
190
- }
191
- return shiftsByPrePaint;
192
- }
193
- /**
194
- * Given a source event list, this returns the first event of that list that directly follows the target event.
195
- */
196
- function getNextEvent(sourceEvents, targetEvent) {
197
- const index = Platform.ArrayUtilities.nearestIndexFromBeginning(sourceEvents, source => source.ts > targetEvent.ts + (targetEvent.dur || 0));
198
- // No PrePaint event registered after this event
199
- if (index === null) {
200
- return undefined;
201
- }
202
- return sourceEvents[index];
203
- }
204
- /**
205
- * An Iframe is considered a root cause if the iframe event occurs before a prePaint event
206
- * and within this prePaint event a layout shift(s) occurs.
207
- */
208
- function getIframeRootCauses(iframeCreatedEvents, prePaintEvents, shiftsByPrePaint, rootCausesByShift, domLoadingEvents) {
209
- for (const iframeEvent of iframeCreatedEvents) {
210
- const nextPrePaint = getNextEvent(prePaintEvents, iframeEvent);
211
- // If no following prePaint, this is not a root cause.
212
- if (!nextPrePaint) {
213
- continue;
214
- }
215
- const shifts = shiftsByPrePaint.get(nextPrePaint);
216
- // if no layout shift(s), this is not a root cause.
217
- if (!shifts) {
218
- continue;
219
- }
220
- for (const shift of shifts) {
221
- const rootCausesForShift = rootCausesByShift.get(shift);
222
- if (!rootCausesForShift) {
223
- throw new Error('Unaccounted shift');
224
- }
225
- // Look for the first dom event that occurs within the bounds of the iframe event.
226
- // This contains the frame id.
227
- const domEvent = domLoadingEvents.find(e => {
228
- const maxIframe = Types.Timing.MicroSeconds(iframeEvent.ts + (iframeEvent.dur ?? 0));
229
- return e.ts >= iframeEvent.ts && e.ts <= maxIframe;
230
- });
231
- if (domEvent && domEvent.args.frame) {
232
- rootCausesForShift.iframeIds.push(domEvent.args.frame);
233
- }
234
- }
235
- }
236
- return rootCausesByShift;
237
- }
238
- /**
239
- * An unsized image is considered a root cause if its PaintImage can be correlated to a
240
- * layout shift. We can correlate PaintImages with unsized images by their matching nodeIds.
241
- * X <- layout shift
242
- * |----------------|
243
- * ^ PrePaint event |-----|
244
- * ^ PaintImage
245
- */
246
- function getUnsizedImageRootCauses(unsizedImageEvents, paintImageEvents, shiftsByPrePaint, rootCausesByShift) {
247
- shiftsByPrePaint.forEach((shifts, prePaint) => {
248
- const paintImage = getNextEvent(paintImageEvents, prePaint);
249
- // The unsized image corresponds to this PaintImage.
250
- const matchingNode = unsizedImageEvents.find(unsizedImage => unsizedImage.args.data.nodeId === paintImage?.args.data.nodeId);
251
- if (!matchingNode) {
252
- return;
253
- }
254
- // The unsized image is a potential root cause of all the shifts of this prePaint.
255
- for (const shift of shifts) {
256
- const rootCausesForShift = rootCausesByShift.get(shift);
257
- if (!rootCausesForShift) {
258
- throw new Error('Unaccounted shift');
259
- }
260
- rootCausesForShift.unsizedImages.push(matchingNode.args.data.nodeId);
261
- }
262
- });
263
- return rootCausesByShift;
264
- }
265
- /**
266
- * A font request is considered a root cause if the request occurs before a prePaint event
267
- * and within this prePaint event a layout shift(s) occurs. Additionally, this font request should
268
- * happen within the ROOT_CAUSE_WINDOW of the prePaint event.
269
- */
270
- function getFontRootCauses(networkRequests, prePaintEvents, shiftsByPrePaint, rootCausesByShift) {
271
- const fontRequests = networkRequests.filter(req => req.args.data.resourceType === 'Font' && req.args.data.mimeType.startsWith('font'));
272
- for (const req of fontRequests) {
273
- const nextPrePaint = getNextEvent(prePaintEvents, req);
274
- if (!nextPrePaint) {
275
- continue;
276
- }
277
- // If the req is outside the ROOT_CAUSE_WINDOW, it could not be a root cause.
278
- if (!isInRootCauseWindow(req, nextPrePaint)) {
279
- continue;
280
- }
281
- // Get the shifts that belong to this prepaint
282
- const shifts = shiftsByPrePaint.get(nextPrePaint);
283
- // if no layout shift(s) in this prePaint, the request is not a root cause.
284
- if (!shifts) {
285
- continue;
286
- }
287
- // Include the root cause to the shifts in this prePaint.
288
- for (const shift of shifts) {
289
- const rootCausesForShift = rootCausesByShift.get(shift);
290
- if (!rootCausesForShift) {
291
- throw new Error('Unaccounted shift');
292
- }
293
- rootCausesForShift.fontRequests.push(req);
294
- }
295
- }
296
- return rootCausesByShift;
297
- }
298
- export function generateInsight(parsedTrace, context) {
299
- const isWithinContext = (event) => Helpers.Timing.eventIsInBounds(event, context.bounds);
300
- const compositeAnimationEvents = parsedTrace.Animations.animations.filter(isWithinContext);
301
- const iframeEvents = parsedTrace.LayoutShifts.renderFrameImplCreateChildFrameEvents.filter(isWithinContext);
302
- const networkRequests = parsedTrace.NetworkRequests.byTime.filter(isWithinContext);
303
- const domLoadingEvents = parsedTrace.LayoutShifts.domLoadingEvents.filter(isWithinContext);
304
- const unsizedImageEvents = parsedTrace.LayoutShifts.layoutImageUnsizedEvents.filter(isWithinContext);
305
- const clusterKey = context.navigation ? context.navigationId : Types.Events.NO_NAVIGATION;
306
- const clusters = parsedTrace.LayoutShifts.clustersByNavigationId.get(clusterKey) ?? [];
307
- const clustersByScore = clusters.toSorted((a, b) => b.clusterCumulativeScore - a.clusterCumulativeScore);
308
- const worstCluster = clustersByScore.at(0);
309
- const layoutShifts = clusters.flatMap(cluster => cluster.events);
310
- const prePaintEvents = parsedTrace.LayoutShifts.prePaintEvents.filter(isWithinContext);
311
- const paintImageEvents = parsedTrace.LayoutShifts.paintImageEvents.filter(isWithinContext);
312
- // Get root causes.
313
- const rootCausesByShift = new Map();
314
- const shiftsByPrePaint = getShiftsByPrePaintEvents(layoutShifts, prePaintEvents);
315
- for (const shift of layoutShifts) {
316
- rootCausesByShift.set(shift, { iframeIds: [], fontRequests: [], nonCompositedAnimations: [], unsizedImages: [] });
317
- }
318
- // Populate root causes for rootCausesByShift.
319
- getIframeRootCauses(iframeEvents, prePaintEvents, shiftsByPrePaint, rootCausesByShift, domLoadingEvents);
320
- getFontRootCauses(networkRequests, prePaintEvents, shiftsByPrePaint, rootCausesByShift);
321
- getUnsizedImageRootCauses(unsizedImageEvents, paintImageEvents, shiftsByPrePaint, rootCausesByShift);
322
- const animationFailures = getNonCompositedFailureRootCauses(compositeAnimationEvents, prePaintEvents, shiftsByPrePaint, rootCausesByShift);
323
- const relatedEvents = [...layoutShifts];
324
- if (worstCluster) {
325
- relatedEvents.push(worstCluster);
326
- }
327
- return {
328
- relatedEvents,
329
- animationFailures,
330
- shifts: rootCausesByShift,
331
- clusters,
332
- worstCluster,
333
- };
334
- }
335
- //# sourceMappingURL=CumulativeLayoutShift.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CumulativeLayoutShift.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/CumulativeLayoutShift.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 Platform from '../../../core/platform/platform.js';\nimport type * as Protocol from '../../../generated/protocol.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport * as Types from '../types/types.js';\n\nimport type {InsightResult, InsightSetContext, RequiredData} from './types.js';\n\nexport type CLSInsightResult = InsightResult<{\n animationFailures: readonly NoncompositedAnimationFailure[],\n shifts: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>,\n clusters: Types.Events.SyntheticLayoutShiftCluster[],\n worstCluster: Types.Events.SyntheticLayoutShiftCluster | undefined,\n}>;\n\nexport function deps(): ['Meta', 'Animations', 'LayoutShifts', 'NetworkRequests'] {\n return ['Meta', 'Animations', 'LayoutShifts', 'NetworkRequests'];\n}\n\nexport const 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 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 * @type {{flag: number, failure: AnimationFailureReasons}[]}\n */\nconst ACTIONABLE_FAILURE_REASONS = [\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];\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.secondsToMicroseconds(Types.Timing.Seconds(0.5));\n\nexport interface LayoutShiftRootCausesData {\n iframeIds: string[];\n fontRequests: Types.Events.SyntheticNetworkRequest[];\n nonCompositedAnimations: NoncompositedAnimationFailure[];\n unsizedImages: Protocol.DOM.BackendNodeId[];\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.LayoutShift[]>,\n rootCausesByShift: Map<Types.Events.LayoutShift, 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.LayoutShift[],\n prePaintEvents: Types.Events.PrePaint[],\n ): Map<Types.Events.PrePaint, Types.Events.LayoutShift[]> {\n // Maps from PrePaint events to LayoutShifts that occured in each one.\n const shiftsByPrePaint = new Map<Types.Events.PrePaint, Types.Events.LayoutShift[]>();\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 iframeCreatedEvents: readonly Types.Events.RenderFrameImplCreateChildFrame[],\n prePaintEvents: Types.Events.PrePaint[], shiftsByPrePaint: Map<Types.Events.PrePaint, Types.Events.LayoutShift[]>,\n rootCausesByShift: Map<Types.Events.LayoutShift, LayoutShiftRootCausesData>,\n domLoadingEvents: readonly Types.Events.DomLoading[]): Map<Types.Events.LayoutShift, 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.MicroSeconds(iframeEvent.ts + (iframeEvent.dur ?? 0));\n return e.ts >= iframeEvent.ts && e.ts <= maxIframe;\n });\n if (domEvent && domEvent.args.frame) {\n rootCausesForShift.iframeIds.push(domEvent.args.frame);\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.LayoutShift[]>,\n rootCausesByShift: Map<Types.Events.LayoutShift, LayoutShiftRootCausesData>):\n Map<Types.Events.LayoutShift, LayoutShiftRootCausesData> {\n shiftsByPrePaint.forEach((shifts, prePaint) => {\n const paintImage = getNextEvent(paintImageEvents, prePaint) as Types.Events.PaintImage | null;\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(matchingNode.args.data.nodeId);\n }\n });\n return rootCausesByShift;\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.LayoutShift[]>,\n rootCausesByShift: Map<Types.Events.LayoutShift, LayoutShiftRootCausesData>):\n Map<Types.Events.LayoutShift, 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.fontRequests.push(req);\n }\n }\n return rootCausesByShift;\n}\n\nexport function generateInsight(parsedTrace: RequiredData<typeof deps>, context: InsightSetContext): CLSInsightResult {\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.toSorted((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, {iframeIds: [], fontRequests: [], nonCompositedAnimations: [], unsizedImages: []});\n }\n\n // Populate root causes for rootCausesByShift.\n getIframeRootCauses(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 return {\n relatedEvents,\n animationFailures,\n shifts: rootCausesByShift,\n clusters,\n worstCluster,\n };\n}\n"]}
@@ -1,9 +0,0 @@
1
- export * as CumulativeLayoutShift from './CumulativeLayoutShift.js';
2
- export * as DocumentLatency from './DocumentLatency.js';
3
- export * as FontDisplay from './FontDisplay.js';
4
- export * as InteractionToNextPaint from './InteractionToNextPaint.js';
5
- export * as LargestContentfulPaint from './LargestContentfulPaint.js';
6
- export * as RenderBlocking from './RenderBlocking.js';
7
- export * as SlowCSSSelector from './SlowCSSSelector.js';
8
- export * as ThirdPartyWeb from './ThirdPartyWeb.js';
9
- export * as Viewport from './Viewport.js';
@@ -1,13 +0,0 @@
1
- // Copyright 2024 The Chromium Authors. All rights reserved.
2
- // Use of this source code is governed by a BSD-style license that can be
3
- // found in the LICENSE file.
4
- export * as CumulativeLayoutShift from './CumulativeLayoutShift.js';
5
- export * as DocumentLatency from './DocumentLatency.js';
6
- export * as FontDisplay from './FontDisplay.js';
7
- export * as InteractionToNextPaint from './InteractionToNextPaint.js';
8
- export * as LargestContentfulPaint from './LargestContentfulPaint.js';
9
- export * as RenderBlocking from './RenderBlocking.js';
10
- export * as SlowCSSSelector from './SlowCSSSelector.js';
11
- export * as ThirdPartyWeb from './ThirdPartyWeb.js';
12
- export * as Viewport from './Viewport.js';
13
- //# sourceMappingURL=InsightRunners.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InsightRunners.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/InsightRunners.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yEAAyE;AACzE,6BAA6B;AAE7B,OAAO,KAAK,qBAAqB,MAAM,4BAA4B,CAAC;AACpE,OAAO,KAAK,eAAe,MAAM,sBAAsB,CAAC;AACxD,OAAO,KAAK,WAAW,MAAM,kBAAkB,CAAC;AAChD,OAAO,KAAK,sBAAsB,MAAM,6BAA6B,CAAC;AACtE,OAAO,KAAK,sBAAsB,MAAM,6BAA6B,CAAC;AACtE,OAAO,KAAK,cAAc,MAAM,qBAAqB,CAAC;AACtD,OAAO,KAAK,eAAe,MAAM,sBAAsB,CAAC;AACxD,OAAO,KAAK,aAAa,MAAM,oBAAoB,CAAC;AACpD,OAAO,KAAK,QAAQ,MAAM,eAAe,CAAC","sourcesContent":["// Copyright 2024 The Chromium Authors. All rights reserved.\n// Use of this source code is governed by a BSD-style license that can be\n// found in the LICENSE file.\n\nexport * as CumulativeLayoutShift from './CumulativeLayoutShift.js';\nexport * as DocumentLatency from './DocumentLatency.js';\nexport * as FontDisplay from './FontDisplay.js';\nexport * as InteractionToNextPaint from './InteractionToNextPaint.js';\nexport * as LargestContentfulPaint from './LargestContentfulPaint.js';\nexport * as RenderBlocking from './RenderBlocking.js';\nexport * as SlowCSSSelector from './SlowCSSSelector.js';\nexport * as ThirdPartyWeb from './ThirdPartyWeb.js';\nexport * as Viewport from './Viewport.js';\n"]}
@@ -1,38 +0,0 @@
1
- import * as Types from '../types/types.js';
2
- import { type InsightResult, type InsightSetContext, type RequiredData } from './types.js';
3
- export declare function deps(): ['NetworkRequests', 'PageLoadMetrics', 'LargestImagePaint', 'Meta'];
4
- interface LCPPhases {
5
- /**
6
- * The time between when the user initiates loading the page until when
7
- * the browser receives the first byte of the html response.
8
- */
9
- ttfb: Types.Timing.MilliSeconds;
10
- /**
11
- * The time between ttfb and the LCP request request being started.
12
- * For a text LCP, this is undefined given no request is loaded.
13
- */
14
- loadDelay?: Types.Timing.MilliSeconds;
15
- /**
16
- * The time it takes to load the LCP request.
17
- */
18
- loadTime?: Types.Timing.MilliSeconds;
19
- /**
20
- * The time between when the LCP request finishes loading and when
21
- * the LCP element is rendered.
22
- */
23
- renderDelay: Types.Timing.MilliSeconds;
24
- }
25
- export type LCPInsightResult = InsightResult<{
26
- lcpMs?: Types.Timing.MilliSeconds;
27
- lcpTs?: Types.Timing.MilliSeconds;
28
- lcpEvent?: Types.Events.LargestContentfulPaintCandidate;
29
- phases?: LCPPhases;
30
- shouldRemoveLazyLoading?: boolean;
31
- shouldIncreasePriorityHint?: boolean;
32
- shouldPreloadImage?: boolean;
33
- /** The network request for the LCP image, if there was one. */
34
- lcpRequest?: Types.Events.SyntheticNetworkRequest;
35
- earliestDiscoveryTimeTs?: Types.Timing.MicroSeconds;
36
- }>;
37
- export declare function generateInsight(parsedTrace: RequiredData<typeof deps>, context: InsightSetContext): LCPInsightResult;
38
- export {};
@@ -1,113 +0,0 @@
1
- // Copyright 2024 The Chromium Authors. All rights reserved.
2
- // Use of this source code is governed by a BSD-style license that can be
3
- // found in the LICENSE file.
4
- import * as Handlers from '../handlers/handlers.js';
5
- import * as Helpers from '../helpers/helpers.js';
6
- import * as Types from '../types/types.js';
7
- import { findLCPRequest } from './Common.js';
8
- import { InsightWarning } from './types.js';
9
- export function deps() {
10
- return ['NetworkRequests', 'PageLoadMetrics', 'LargestImagePaint', 'Meta'];
11
- }
12
- function anyValuesNaN(...values) {
13
- return values.some(v => Number.isNaN(v));
14
- }
15
- /**
16
- * Calculates the 4 phases of an LCP and the timings of each.
17
- * Will return `null` if any required values were missing. We don't ever expect
18
- * them to be missing on newer traces, but old trace files may lack some of the
19
- * data we rely on, so we want to handle that case.
20
- */
21
- function breakdownPhases(nav, docRequest, lcpMs, lcpRequest) {
22
- const docReqTiming = docRequest.args.data.timing;
23
- if (!docReqTiming) {
24
- throw new Error('no timing for document request');
25
- }
26
- const firstDocByteTs = Helpers.Timing.secondsToMicroseconds(docReqTiming.requestTime) +
27
- Helpers.Timing.millisecondsToMicroseconds(docReqTiming.receiveHeadersStart);
28
- const firstDocByteTiming = Types.Timing.MicroSeconds(firstDocByteTs - nav.ts);
29
- const ttfb = Helpers.Timing.microSecondsToMilliseconds(firstDocByteTiming);
30
- let renderDelay = Types.Timing.MilliSeconds(lcpMs - ttfb);
31
- if (!lcpRequest) {
32
- if (anyValuesNaN(ttfb, renderDelay)) {
33
- return null;
34
- }
35
- return { ttfb, renderDelay };
36
- }
37
- const lcpStartTs = Types.Timing.MicroSeconds(lcpRequest.ts - nav.ts);
38
- const requestStart = Helpers.Timing.microSecondsToMilliseconds(lcpStartTs);
39
- const lcpReqEndTs = Types.Timing.MicroSeconds(lcpRequest.args.data.syntheticData.finishTime - nav.ts);
40
- const requestEnd = Helpers.Timing.microSecondsToMilliseconds(lcpReqEndTs);
41
- const loadDelay = Types.Timing.MilliSeconds(requestStart - ttfb);
42
- const loadTime = Types.Timing.MilliSeconds(requestEnd - requestStart);
43
- renderDelay = Types.Timing.MilliSeconds(lcpMs - requestEnd);
44
- if (anyValuesNaN(ttfb, loadDelay, loadTime, renderDelay)) {
45
- return null;
46
- }
47
- return {
48
- ttfb,
49
- loadDelay,
50
- loadTime,
51
- renderDelay,
52
- };
53
- }
54
- export function generateInsight(parsedTrace, context) {
55
- if (!context.navigation) {
56
- return {};
57
- }
58
- const networkRequests = parsedTrace.NetworkRequests;
59
- const frameMetrics = parsedTrace.PageLoadMetrics.metricScoresByFrameId.get(context.frameId);
60
- if (!frameMetrics) {
61
- throw new Error('no frame metrics');
62
- }
63
- const navMetrics = frameMetrics.get(context.navigationId);
64
- if (!navMetrics) {
65
- throw new Error('no navigation metrics');
66
- }
67
- const metricScore = navMetrics.get("LCP" /* Handlers.ModelHandlers.PageLoadMetrics.MetricName.LCP */);
68
- const lcpEvent = metricScore?.event;
69
- if (!lcpEvent || !Types.Events.isLargestContentfulPaintCandidate(lcpEvent)) {
70
- return { warnings: [InsightWarning.NO_LCP] };
71
- }
72
- // This helps calculate the phases.
73
- const lcpMs = Helpers.Timing.microSecondsToMilliseconds(metricScore.timing);
74
- // This helps position things on the timeline's UI accurately for a trace.
75
- const lcpTs = metricScore.event?.ts ? Helpers.Timing.microSecondsToMilliseconds(metricScore.event?.ts) : undefined;
76
- const lcpRequest = findLCPRequest(parsedTrace, context, lcpEvent);
77
- const docRequest = networkRequests.byTime.find(req => req.args.data.requestId === context.navigationId);
78
- if (!docRequest) {
79
- return { lcpMs, lcpTs, lcpEvent, warnings: [InsightWarning.NO_DOCUMENT_REQUEST] };
80
- }
81
- if (!lcpRequest) {
82
- return {
83
- lcpMs,
84
- lcpTs,
85
- lcpEvent,
86
- phases: breakdownPhases(context.navigation, docRequest, lcpMs, lcpRequest) ?? undefined,
87
- };
88
- }
89
- const initiatorUrl = lcpRequest.args.data.initiator?.url;
90
- // TODO(b/372319476): Explore using trace event HTMLDocumentParser::FetchQueuedPreloads to determine if the request
91
- // is discovered by the preload scanner.
92
- const initiatedByMainDoc = lcpRequest?.args.data.initiator?.type === 'parser' && docRequest.args.data.url === initiatorUrl;
93
- const imgPreloadedOrFoundInHTML = lcpRequest?.args.data.isLinkPreload || initiatedByMainDoc;
94
- const imageLoadingAttr = lcpEvent.args.data?.loadingAttr;
95
- const imageFetchPriorityHint = lcpRequest?.args.data.fetchPriorityHint;
96
- // This is the earliest discovery time an LCP request could have - it's TTFB.
97
- const earliestDiscoveryTime = docRequest && docRequest.args.data.timing ?
98
- Helpers.Timing.secondsToMicroseconds(docRequest.args.data.timing.requestTime) +
99
- Helpers.Timing.millisecondsToMicroseconds(docRequest.args.data.timing.receiveHeadersStart) :
100
- undefined;
101
- return {
102
- lcpMs,
103
- lcpTs,
104
- lcpEvent,
105
- phases: breakdownPhases(context.navigation, docRequest, lcpMs, lcpRequest) ?? undefined,
106
- shouldRemoveLazyLoading: imageLoadingAttr === 'lazy',
107
- shouldIncreasePriorityHint: imageFetchPriorityHint !== 'high',
108
- shouldPreloadImage: !imgPreloadedOrFoundInHTML,
109
- lcpRequest,
110
- earliestDiscoveryTimeTs: earliestDiscoveryTime ? Types.Timing.MicroSeconds(earliestDiscoveryTime) : undefined,
111
- };
112
- }
113
- //# sourceMappingURL=LargestContentfulPaint.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"LargestContentfulPaint.js","sourceRoot":"","sources":["../../../../../../../front_end/models/trace/insights/LargestContentfulPaint.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 Handlers from '../handlers/handlers.js';\nimport * as Helpers from '../helpers/helpers.js';\nimport * as Types from '../types/types.js';\n\nimport {findLCPRequest} from './Common.js';\nimport {type InsightResult, type InsightSetContext, InsightWarning, type RequiredData} from './types.js';\n\nexport function deps(): ['NetworkRequests', 'PageLoadMetrics', 'LargestImagePaint', 'Meta'] {\n return ['NetworkRequests', 'PageLoadMetrics', 'LargestImagePaint', 'Meta'];\n}\n\ninterface LCPPhases {\n /**\n * The time between when the user initiates loading the page until when\n * the browser receives the first byte of the html response.\n */\n ttfb: Types.Timing.MilliSeconds;\n /**\n * The time between ttfb and the LCP request request being started.\n * For a text LCP, this is undefined given no request is loaded.\n */\n loadDelay?: Types.Timing.MilliSeconds;\n /**\n * The time it takes to load the LCP request.\n */\n loadTime?: Types.Timing.MilliSeconds;\n /**\n * The time between when the LCP request finishes loading and when\n * the LCP element is rendered.\n */\n renderDelay: Types.Timing.MilliSeconds;\n}\n\nexport type LCPInsightResult = InsightResult<{\n lcpMs?: Types.Timing.MilliSeconds,\n lcpTs?: Types.Timing.MilliSeconds,\n lcpEvent?: Types.Events.LargestContentfulPaintCandidate,\n phases?: LCPPhases,\n shouldRemoveLazyLoading?: boolean,\n shouldIncreasePriorityHint?: boolean,\n shouldPreloadImage?: boolean,\n /** The network request for the LCP image, if there was one. */\n lcpRequest?: Types.Events.SyntheticNetworkRequest,\n earliestDiscoveryTimeTs?: Types.Timing.MicroSeconds,\n}>;\n\nfunction anyValuesNaN(...values: number[]): boolean {\n return values.some(v => Number.isNaN(v));\n}\n/**\n * Calculates the 4 phases of an LCP and the timings of each.\n * Will return `null` if any required values were missing. We don't ever expect\n * them to be missing on newer traces, but old trace files may lack some of the\n * data we rely on, so we want to handle that case.\n */\nfunction breakdownPhases(\n nav: Types.Events.NavigationStart, docRequest: Types.Events.SyntheticNetworkRequest,\n lcpMs: Types.Timing.MilliSeconds, lcpRequest: Types.Events.SyntheticNetworkRequest|null): LCPPhases|null {\n const docReqTiming = docRequest.args.data.timing;\n if (!docReqTiming) {\n throw new Error('no timing for document request');\n }\n const firstDocByteTs = Helpers.Timing.secondsToMicroseconds(docReqTiming.requestTime) +\n Helpers.Timing.millisecondsToMicroseconds(docReqTiming.receiveHeadersStart);\n\n const firstDocByteTiming = Types.Timing.MicroSeconds(firstDocByteTs - nav.ts);\n const ttfb = Helpers.Timing.microSecondsToMilliseconds(firstDocByteTiming);\n let renderDelay = Types.Timing.MilliSeconds(lcpMs - ttfb);\n\n if (!lcpRequest) {\n if (anyValuesNaN(ttfb, renderDelay)) {\n return null;\n }\n return {ttfb, renderDelay};\n }\n\n const lcpStartTs = Types.Timing.MicroSeconds(lcpRequest.ts - nav.ts);\n const requestStart = Helpers.Timing.microSecondsToMilliseconds(lcpStartTs);\n\n const lcpReqEndTs = Types.Timing.MicroSeconds(lcpRequest.args.data.syntheticData.finishTime - nav.ts);\n const requestEnd = Helpers.Timing.microSecondsToMilliseconds(lcpReqEndTs);\n\n const loadDelay = Types.Timing.MilliSeconds(requestStart - ttfb);\n const loadTime = Types.Timing.MilliSeconds(requestEnd - requestStart);\n renderDelay = Types.Timing.MilliSeconds(lcpMs - requestEnd);\n if (anyValuesNaN(ttfb, loadDelay, loadTime, renderDelay)) {\n return null;\n }\n\n return {\n ttfb,\n loadDelay,\n loadTime,\n renderDelay,\n };\n}\n\nexport function generateInsight(parsedTrace: RequiredData<typeof deps>, context: InsightSetContext): LCPInsightResult {\n if (!context.navigation) {\n return {};\n }\n\n const networkRequests = parsedTrace.NetworkRequests;\n\n const frameMetrics = parsedTrace.PageLoadMetrics.metricScoresByFrameId.get(context.frameId);\n if (!frameMetrics) {\n throw new Error('no frame metrics');\n }\n\n const navMetrics = frameMetrics.get(context.navigationId);\n if (!navMetrics) {\n throw new Error('no navigation metrics');\n }\n const metricScore = navMetrics.get(Handlers.ModelHandlers.PageLoadMetrics.MetricName.LCP);\n const lcpEvent = metricScore?.event;\n if (!lcpEvent || !Types.Events.isLargestContentfulPaintCandidate(lcpEvent)) {\n return {warnings: [InsightWarning.NO_LCP]};\n }\n\n // This helps calculate the phases.\n const lcpMs = Helpers.Timing.microSecondsToMilliseconds(metricScore.timing);\n // This helps position things on the timeline's UI accurately for a trace.\n const lcpTs = metricScore.event?.ts ? Helpers.Timing.microSecondsToMilliseconds(metricScore.event?.ts) : undefined;\n const lcpRequest = findLCPRequest(parsedTrace, context, lcpEvent);\n const docRequest = networkRequests.byTime.find(req => req.args.data.requestId === context.navigationId);\n if (!docRequest) {\n return {lcpMs, lcpTs, lcpEvent, warnings: [InsightWarning.NO_DOCUMENT_REQUEST]};\n }\n\n if (!lcpRequest) {\n return {\n lcpMs,\n lcpTs,\n lcpEvent,\n phases: breakdownPhases(context.navigation, docRequest, lcpMs, lcpRequest) ?? undefined,\n };\n }\n\n const initiatorUrl = lcpRequest.args.data.initiator?.url;\n // TODO(b/372319476): Explore using trace event HTMLDocumentParser::FetchQueuedPreloads to determine if the request\n // is discovered by the preload scanner.\n const initiatedByMainDoc =\n lcpRequest?.args.data.initiator?.type === 'parser' && docRequest.args.data.url === initiatorUrl;\n const imgPreloadedOrFoundInHTML = lcpRequest?.args.data.isLinkPreload || initiatedByMainDoc;\n\n const imageLoadingAttr = lcpEvent.args.data?.loadingAttr;\n const imageFetchPriorityHint = lcpRequest?.args.data.fetchPriorityHint;\n // This is the earliest discovery time an LCP request could have - it's TTFB.\n const earliestDiscoveryTime = docRequest && docRequest.args.data.timing ?\n Helpers.Timing.secondsToMicroseconds(docRequest.args.data.timing.requestTime) +\n Helpers.Timing.millisecondsToMicroseconds(docRequest.args.data.timing.receiveHeadersStart) :\n undefined;\n\n return {\n lcpMs,\n lcpTs,\n lcpEvent,\n phases: breakdownPhases(context.navigation, docRequest, lcpMs, lcpRequest) ?? undefined,\n shouldRemoveLazyLoading: imageLoadingAttr === 'lazy',\n shouldIncreasePriorityHint: imageFetchPriorityHint !== 'high',\n shouldPreloadImage: !imgPreloadedOrFoundInHTML,\n lcpRequest,\n earliestDiscoveryTimeTs: earliestDiscoveryTime ? Types.Timing.MicroSeconds(earliestDiscoveryTime) : undefined,\n };\n}\n"]}
@@ -1,13 +0,0 @@
1
- import * as Extras from '../extras/extras.js';
2
- import type * as Types from '../types/types.js';
3
- import type { InsightResult, InsightSetContext, RequiredData } from './types.js';
4
- export declare function deps(): ['Meta', 'NetworkRequests', 'Renderer', 'ImagePainting'];
5
- export type ThirdPartyWebInsightResult = InsightResult<{
6
- entityByRequest: Map<Types.Events.SyntheticNetworkRequest, Extras.ThirdParties.Entity>;
7
- requestsByEntity: Map<Extras.ThirdParties.Entity, Types.Events.SyntheticNetworkRequest[]>;
8
- summaryByRequest: Map<Types.Events.SyntheticNetworkRequest, Extras.ThirdParties.Summary>;
9
- summaryByEntity: Map<Extras.ThirdParties.Entity, Extras.ThirdParties.Summary>;
10
- /** The entity for this navigation's URL. Any other entity is from a third party. */
11
- firstPartyEntity?: Extras.ThirdParties.Entity;
12
- }>;
13
- export declare function generateInsight(parsedTrace: RequiredData<typeof deps>, context: InsightSetContext): ThirdPartyWebInsightResult;