lighthouse 12.8.2 → 13.0.0-dev.20251010

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 (270) hide show
  1. package/cli/cli-flags.js +1 -1
  2. package/cli/test/smokehouse/config/exclusions.js +0 -2
  3. package/cli/test/smokehouse/version-check.d.ts +1 -1
  4. package/core/audits/accessibility/accesskeys.js +3 -3
  5. package/core/audits/accessibility/aria-allowed-attr.js +3 -3
  6. package/core/audits/accessibility/aria-allowed-role.js +2 -1
  7. package/core/audits/accessibility/aria-command-name.js +1 -1
  8. package/core/audits/accessibility/aria-conditional-attr.js +1 -1
  9. package/core/audits/accessibility/aria-deprecated-role.js +1 -1
  10. package/core/audits/accessibility/aria-dialog-name.js +1 -1
  11. package/core/audits/accessibility/aria-hidden-body.js +3 -3
  12. package/core/audits/accessibility/aria-hidden-focus.js +3 -3
  13. package/core/audits/accessibility/aria-input-field-name.js +3 -3
  14. package/core/audits/accessibility/aria-meter-name.js +1 -1
  15. package/core/audits/accessibility/aria-progressbar-name.js +1 -1
  16. package/core/audits/accessibility/aria-prohibited-attr.js +1 -1
  17. package/core/audits/accessibility/aria-required-attr.js +3 -3
  18. package/core/audits/accessibility/aria-required-children.js +3 -3
  19. package/core/audits/accessibility/aria-required-parent.js +3 -3
  20. package/core/audits/accessibility/aria-roles.js +3 -3
  21. package/core/audits/accessibility/aria-text.js +3 -3
  22. package/core/audits/accessibility/aria-toggle-field-name.js +3 -3
  23. package/core/audits/accessibility/aria-tooltip-name.js +1 -1
  24. package/core/audits/accessibility/aria-treeitem-name.js +1 -1
  25. package/core/audits/accessibility/aria-valid-attr-value.js +3 -3
  26. package/core/audits/accessibility/aria-valid-attr.js +3 -3
  27. package/core/audits/accessibility/button-name.js +3 -3
  28. package/core/audits/accessibility/bypass.js +3 -3
  29. package/core/audits/accessibility/color-contrast.js +3 -3
  30. package/core/audits/accessibility/definition-list.js +3 -3
  31. package/core/audits/accessibility/dlitem.js +3 -3
  32. package/core/audits/accessibility/document-title.js +3 -3
  33. package/core/audits/accessibility/duplicate-id-aria.js +3 -3
  34. package/core/audits/accessibility/empty-heading.js +3 -3
  35. package/core/audits/accessibility/form-field-multiple-labels.js +3 -3
  36. package/core/audits/accessibility/frame-title.js +3 -3
  37. package/core/audits/accessibility/heading-order.js +3 -3
  38. package/core/audits/accessibility/html-has-lang.js +3 -3
  39. package/core/audits/accessibility/html-lang-valid.js +3 -3
  40. package/core/audits/accessibility/html-xml-lang-mismatch.js +3 -3
  41. package/core/audits/accessibility/identical-links-same-purpose.js +3 -3
  42. package/core/audits/accessibility/image-alt.js +3 -3
  43. package/core/audits/accessibility/image-redundant-alt.js +4 -3
  44. package/core/audits/accessibility/input-button-name.js +3 -3
  45. package/core/audits/accessibility/input-image-alt.js +3 -3
  46. package/core/audits/accessibility/label-content-name-mismatch.js +3 -3
  47. package/core/audits/accessibility/label.js +3 -3
  48. package/core/audits/accessibility/landmark-one-main.js +3 -4
  49. package/core/audits/accessibility/link-in-text-block.js +3 -3
  50. package/core/audits/accessibility/link-name.js +3 -3
  51. package/core/audits/accessibility/list.js +3 -3
  52. package/core/audits/accessibility/listitem.js +3 -3
  53. package/core/audits/accessibility/meta-refresh.js +3 -3
  54. package/core/audits/accessibility/meta-viewport.js +3 -3
  55. package/core/audits/accessibility/object-alt.js +3 -3
  56. package/core/audits/accessibility/select-name.js +3 -3
  57. package/core/audits/accessibility/skip-link.js +3 -3
  58. package/core/audits/accessibility/tabindex.js +3 -3
  59. package/core/audits/accessibility/table-duplicate-name.js +4 -3
  60. package/core/audits/accessibility/table-fake-caption.js +3 -3
  61. package/core/audits/accessibility/target-size.js +3 -3
  62. package/core/audits/accessibility/td-has-header.js +3 -3
  63. package/core/audits/accessibility/td-headers-attr.js +3 -3
  64. package/core/audits/accessibility/th-has-data-cells.js +3 -3
  65. package/core/audits/accessibility/valid-lang.js +3 -3
  66. package/core/audits/accessibility/video-caption.js +3 -3
  67. package/core/audits/audit.d.ts +0 -4
  68. package/core/audits/audit.js +2 -13
  69. package/core/audits/insights/cls-culprits-insight.js +1 -1
  70. package/core/audits/insights/dom-size-insight.js +11 -7
  71. package/core/audits/insights/font-display-insight.js +3 -1
  72. package/core/audits/insights/image-delivery-insight.js +4 -1
  73. package/core/audits/insights/insight-audit.d.ts +6 -4
  74. package/core/audits/insights/insight-audit.js +27 -8
  75. package/core/audits/insights/third-parties-insight.js +1 -1
  76. package/core/audits/layout-shifts.js +1 -1
  77. package/core/audits/predictive-perf.js +2 -2
  78. package/core/audits/seo/crawlable-anchors.js +2 -3
  79. package/core/audits/seo/manual/structured-data.js +1 -1
  80. package/core/audits/server-response-time.d.ts +0 -5
  81. package/core/audits/server-response-time.js +12 -26
  82. package/core/computed/metrics/cumulative-layout-shift.js +2 -2
  83. package/core/computed/metrics/lantern-metric.js +3 -3
  84. package/core/computed/metrics/lcp-breakdown.d.ts +10 -5
  85. package/core/computed/metrics/lcp-breakdown.js +50 -22
  86. package/core/computed/metrics/time-to-first-byte.js +33 -10
  87. package/core/computed/metrics/timing-summary.js +3 -2
  88. package/core/computed/page-dependency-graph.js +1 -1
  89. package/core/computed/trace-engine-result.js +2 -2
  90. package/core/config/default-config.js +110 -152
  91. package/core/config/experimental-config.js +1 -32
  92. package/core/config/filters.js +6 -9
  93. package/core/config/lr-desktop-config.js +0 -1
  94. package/core/config/lr-mobile-config.js +0 -1
  95. package/core/gather/driver/target-manager.d.ts +1 -1
  96. package/core/gather/driver.d.ts +1 -1
  97. package/core/gather/gatherers/anchor-elements.js +8 -24
  98. package/core/gather/gatherers/image-elements.js +32 -6
  99. package/core/gather/gatherers/inspector-issues.js +1 -28
  100. package/core/gather/gatherers/trace-elements.d.ts +2 -11
  101. package/core/gather/gatherers/trace-elements.js +9 -39
  102. package/core/gather/navigation-runner.js +0 -3
  103. package/core/gather/session.d.ts +1 -1
  104. package/core/lib/asset-saver.d.ts +2 -2
  105. package/core/lib/asset-saver.js +33 -43
  106. package/core/lib/bf-cache-strings.js +10 -9
  107. package/core/lib/deprecations-strings.js +5 -5
  108. package/core/lib/emulation.d.ts +10 -0
  109. package/core/lib/emulation.js +21 -6
  110. package/core/lib/legacy-javascript/legacy-javascript.js +4 -11
  111. package/core/lib/network-request.d.ts +0 -7
  112. package/core/lib/network-request.js +0 -16
  113. package/core/lib/proto-preprocessor.js +10 -25
  114. package/core/runner.js +1 -8
  115. package/core/scoring.js +1 -1
  116. package/dist/report/bundle.esm.js +10 -49
  117. package/dist/report/flow.js +12 -51
  118. package/dist/report/standalone.js +11 -50
  119. package/flow-report/src/i18n/i18n.d.ts +4 -6
  120. package/package.json +16 -19
  121. package/readme.md +2 -2
  122. package/report/assets/styles.css +0 -39
  123. package/report/renderer/api.js +0 -1
  124. package/report/renderer/category-renderer.js +6 -0
  125. package/report/renderer/components.js +1 -1
  126. package/report/renderer/details-renderer.d.ts +1 -2
  127. package/report/renderer/details-renderer.js +0 -1
  128. package/report/renderer/dom.d.ts +0 -13
  129. package/report/renderer/dom.js +0 -38
  130. package/report/renderer/performance-category-renderer.d.ts +0 -26
  131. package/report/renderer/performance-category-renderer.js +10 -142
  132. package/report/renderer/report-ui-features.d.ts +0 -1
  133. package/report/renderer/report-ui-features.js +2 -13
  134. package/report/renderer/report-utils.d.ts +2 -3
  135. package/report/renderer/report-utils.js +4 -6
  136. package/report/types/report-renderer.d.ts +0 -6
  137. package/shared/localization/locales/ar-XB.json +107 -455
  138. package/shared/localization/locales/ar.json +107 -455
  139. package/shared/localization/locales/bg.json +96 -444
  140. package/shared/localization/locales/ca.json +96 -444
  141. package/shared/localization/locales/cs.json +96 -444
  142. package/shared/localization/locales/da.json +96 -444
  143. package/shared/localization/locales/de.json +96 -444
  144. package/shared/localization/locales/el.json +96 -444
  145. package/shared/localization/locales/en-GB.json +96 -444
  146. package/shared/localization/locales/en-US.json +116 -467
  147. package/shared/localization/locales/en-XA.json +93 -441
  148. package/shared/localization/locales/en-XL.json +116 -467
  149. package/shared/localization/locales/es-419.json +96 -444
  150. package/shared/localization/locales/es.json +96 -444
  151. package/shared/localization/locales/fi.json +96 -444
  152. package/shared/localization/locales/fil.json +96 -444
  153. package/shared/localization/locales/fr.json +96 -444
  154. package/shared/localization/locales/he.json +118 -466
  155. package/shared/localization/locales/hi.json +96 -444
  156. package/shared/localization/locales/hr.json +100 -448
  157. package/shared/localization/locales/hu.json +96 -444
  158. package/shared/localization/locales/id.json +96 -444
  159. package/shared/localization/locales/it.json +96 -444
  160. package/shared/localization/locales/ja.json +96 -444
  161. package/shared/localization/locales/ko.json +97 -445
  162. package/shared/localization/locales/lt.json +96 -444
  163. package/shared/localization/locales/lv.json +97 -445
  164. package/shared/localization/locales/nl.json +96 -444
  165. package/shared/localization/locales/no.json +96 -444
  166. package/shared/localization/locales/pl.json +96 -444
  167. package/shared/localization/locales/pt-PT.json +96 -444
  168. package/shared/localization/locales/pt.json +97 -445
  169. package/shared/localization/locales/ro.json +97 -445
  170. package/shared/localization/locales/ru.json +96 -444
  171. package/shared/localization/locales/sk.json +96 -444
  172. package/shared/localization/locales/sl.json +96 -444
  173. package/shared/localization/locales/sr-Latn.json +96 -444
  174. package/shared/localization/locales/sr.json +96 -444
  175. package/shared/localization/locales/sv.json +96 -444
  176. package/shared/localization/locales/ta.json +96 -444
  177. package/shared/localization/locales/te.json +97 -445
  178. package/shared/localization/locales/th.json +96 -444
  179. package/shared/localization/locales/tr.json +96 -444
  180. package/shared/localization/locales/uk.json +96 -444
  181. package/shared/localization/locales/vi.json +96 -444
  182. package/shared/localization/locales/zh-HK.json +96 -444
  183. package/shared/localization/locales/zh-TW.json +97 -445
  184. package/shared/localization/locales/zh.json +96 -444
  185. package/shared/localization/locales.d.ts +2 -0
  186. package/shared/localization/locales.js +130 -139
  187. package/shared/tsconfig.json +2 -0
  188. package/tsconfig-base.json +2 -2
  189. package/tsconfig.json +1 -4
  190. package/types/artifacts.d.ts +6 -81
  191. package/types/audit.d.ts +1 -1
  192. package/types/lhr/settings.d.ts +1 -1
  193. package/core/audits/byte-efficiency/duplicated-javascript.d.ts +0 -45
  194. package/core/audits/byte-efficiency/duplicated-javascript.js +0 -223
  195. package/core/audits/byte-efficiency/efficient-animated-content.d.ts +0 -22
  196. package/core/audits/byte-efficiency/efficient-animated-content.js +0 -93
  197. package/core/audits/byte-efficiency/legacy-javascript.d.ts +0 -28
  198. package/core/audits/byte-efficiency/legacy-javascript.js +0 -144
  199. package/core/audits/byte-efficiency/modern-image-formats.d.ts +0 -38
  200. package/core/audits/byte-efficiency/modern-image-formats.js +0 -187
  201. package/core/audits/byte-efficiency/offscreen-images.d.ts +0 -63
  202. package/core/audits/byte-efficiency/offscreen-images.js +0 -240
  203. package/core/audits/byte-efficiency/render-blocking-resources.d.ts +0 -53
  204. package/core/audits/byte-efficiency/render-blocking-resources.js +0 -312
  205. package/core/audits/byte-efficiency/uses-long-cache-ttl.d.ts +0 -59
  206. package/core/audits/byte-efficiency/uses-long-cache-ttl.js +0 -293
  207. package/core/audits/byte-efficiency/uses-optimized-images.d.ts +0 -33
  208. package/core/audits/byte-efficiency/uses-optimized-images.js +0 -146
  209. package/core/audits/byte-efficiency/uses-responsive-images-snapshot.d.ts +0 -16
  210. package/core/audits/byte-efficiency/uses-responsive-images-snapshot.js +0 -106
  211. package/core/audits/byte-efficiency/uses-responsive-images.d.ts +0 -44
  212. package/core/audits/byte-efficiency/uses-responsive-images.js +0 -202
  213. package/core/audits/byte-efficiency/uses-text-compression.d.ts +0 -14
  214. package/core/audits/byte-efficiency/uses-text-compression.js +0 -108
  215. package/core/audits/critical-request-chains.d.ts +0 -44
  216. package/core/audits/critical-request-chains.js +0 -221
  217. package/core/audits/dobetterweb/dom-size.d.ts +0 -32
  218. package/core/audits/dobetterweb/dom-size.js +0 -182
  219. package/core/audits/dobetterweb/no-document-write.d.ts +0 -16
  220. package/core/audits/dobetterweb/no-document-write.js +0 -86
  221. package/core/audits/dobetterweb/uses-http2.d.ts +0 -72
  222. package/core/audits/dobetterweb/uses-http2.js +0 -276
  223. package/core/audits/dobetterweb/uses-passive-event-listeners.d.ts +0 -16
  224. package/core/audits/dobetterweb/uses-passive-event-listeners.js +0 -69
  225. package/core/audits/font-display.d.ts +0 -32
  226. package/core/audits/font-display.js +0 -195
  227. package/core/audits/largest-contentful-paint-element.d.ts +0 -34
  228. package/core/audits/largest-contentful-paint-element.js +0 -181
  229. package/core/audits/lcp-lazy-loaded.d.ts +0 -22
  230. package/core/audits/lcp-lazy-loaded.js +0 -115
  231. package/core/audits/metrics/first-meaningful-paint.d.ts +0 -12
  232. package/core/audits/metrics/first-meaningful-paint.js +0 -47
  233. package/core/audits/preload-fonts.d.ts +0 -25
  234. package/core/audits/preload-fonts.js +0 -97
  235. package/core/audits/prioritize-lcp-image.d.ts +0 -74
  236. package/core/audits/prioritize-lcp-image.js +0 -297
  237. package/core/audits/seo/font-size.d.ts +0 -24
  238. package/core/audits/seo/font-size.js +0 -344
  239. package/core/audits/third-party-facades.d.ts +0 -41
  240. package/core/audits/third-party-facades.js +0 -234
  241. package/core/audits/third-party-summary.d.ts +0 -78
  242. package/core/audits/third-party-summary.js +0 -236
  243. package/core/audits/uses-rel-preconnect.d.ts +0 -37
  244. package/core/audits/uses-rel-preconnect.js +0 -286
  245. package/core/audits/uses-rel-preload.d.ts +0 -57
  246. package/core/audits/uses-rel-preload.js +0 -263
  247. package/core/audits/viewport.d.ts +0 -17
  248. package/core/audits/viewport.js +0 -87
  249. package/core/audits/work-during-interaction.d.ts +0 -81
  250. package/core/audits/work-during-interaction.js +0 -287
  251. package/core/computed/critical-request-chains.d.ts +0 -42
  252. package/core/computed/critical-request-chains.js +0 -143
  253. package/core/computed/viewport-meta.d.ts +0 -37
  254. package/core/computed/viewport-meta.js +0 -71
  255. package/core/gather/gatherers/cache-contents.d.ts +0 -11
  256. package/core/gather/gatherers/cache-contents.js +0 -56
  257. package/core/gather/gatherers/devtools-log-compat.d.ts +0 -13
  258. package/core/gather/gatherers/devtools-log-compat.js +0 -35
  259. package/core/gather/gatherers/dobetterweb/domstats.d.ts +0 -10
  260. package/core/gather/gatherers/dobetterweb/domstats.js +0 -102
  261. package/core/gather/gatherers/dobetterweb/optimized-images.d.ts +0 -48
  262. package/core/gather/gatherers/dobetterweb/optimized-images.js +0 -169
  263. package/core/gather/gatherers/dobetterweb/response-compression.d.ts +0 -23
  264. package/core/gather/gatherers/dobetterweb/response-compression.js +0 -136
  265. package/core/gather/gatherers/seo/font-size.d.ts +0 -131
  266. package/core/gather/gatherers/seo/font-size.js +0 -347
  267. package/core/gather/gatherers/trace-compat.d.ts +0 -13
  268. package/core/gather/gatherers/trace-compat.js +0 -35
  269. package/types/internal/metaviewport-parser.d.ts +0 -13
  270. package/types/internal/parse-cache-control.d.ts +0 -20
@@ -1,286 +0,0 @@
1
- /**
2
- * @license
3
- * Copyright 2018 Google LLC
4
- * SPDX-License-Identifier: Apache-2.0
5
- */
6
-
7
- import {Audit} from './audit.js';
8
- import UrlUtils from '../lib/url-utils.js';
9
- import * as i18n from '../lib/i18n/i18n.js';
10
- import {NetworkRecords} from '../computed/network-records.js';
11
- import {MainResource} from '../computed/main-resource.js';
12
- import {LoadSimulator} from '../computed/load-simulator.js';
13
- import {ProcessedNavigation} from '../computed/processed-navigation.js';
14
- import {PageDependencyGraph} from '../computed/page-dependency-graph.js';
15
- import {LanternLargestContentfulPaint} from '../computed/metrics/lantern-largest-contentful-paint.js';
16
- import {LanternFirstContentfulPaint} from '../computed/metrics/lantern-first-contentful-paint.js';
17
-
18
- // Preconnect establishes a "clean" socket. Chrome's socket manager will keep an unused socket
19
- // around for 10s. Meaning, the time delta between processing preconnect a request should be <10s,
20
- // otherwise it's wasted. We add a 5s margin so we are sure to capture all key requests.
21
- // @see https://github.com/GoogleChrome/lighthouse/issues/3106#issuecomment-333653747
22
- const PRECONNECT_SOCKET_MAX_IDLE_IN_MS = 15_000;
23
-
24
- const IGNORE_THRESHOLD_IN_MS = 50;
25
-
26
- const UIStrings = {
27
- /** Imperative title of a Lighthouse audit that tells the user to connect early to internet domains that will be used to load page resources. Origin is the correct term, however 'domain name' could be used if neccsesary. This is displayed in a list of audit titles that Lighthouse generates. */
28
- title: 'Preconnect to required origins',
29
- /** Description of a Lighthouse audit that tells the user how to connect early to third-party domains that will be used to load page resources. This is displayed after a user expands the section to see more. No character length limits. The last sentence starting with 'Learn' becomes link text to additional documentation. */
30
- description:
31
- 'Consider adding `preconnect` or `dns-prefetch` resource hints to establish early ' +
32
- 'connections to important third-party origins. ' +
33
- '[Learn how to preconnect to required origins](https://developer.chrome.com/docs/lighthouse/performance/uses-rel-preconnect/).',
34
- /**
35
- * @description A warning message that is shown when the user tried to follow the advice of the audit, but it's not working as expected.
36
- * @example {https://example.com} securityOrigin
37
- * */
38
- unusedWarning: 'A `<link rel=preconnect>` was found for "{securityOrigin}" but was not used ' +
39
- 'by the browser. Only use `preconnect` for important origins ' +
40
- 'that the page will certainly request.',
41
- /**
42
- * @description A warning message that is shown when the user tried to follow the advice of the audit, but it's not working as expected. Forgetting to set the `crossorigin` HTML attribute, or setting it to an incorrect value, on the link is a common mistake when adding preconnect links.
43
- * @example {https://example.com} securityOrigin
44
- * */
45
- crossoriginWarning: 'A `<link rel=preconnect>` was found for "{securityOrigin}" but was not ' +
46
- 'used by the browser. Check that you are using the `crossorigin` attribute properly.',
47
- /** A warning message that is shown when found more than 2 preconnected links */
48
- tooManyPreconnectLinksWarning: 'More than 2 `<link rel=preconnect>` connections were found. ' +
49
- 'These should be used sparingly and only to the most important origins.',
50
- };
51
-
52
- const str_ = i18n.createIcuMessageFn(import.meta.url, UIStrings);
53
-
54
- class UsesRelPreconnectAudit extends Audit {
55
- /**
56
- * @return {LH.Audit.Meta}
57
- */
58
- static get meta() {
59
- return {
60
- id: 'uses-rel-preconnect',
61
- title: str_(UIStrings.title),
62
- description: str_(UIStrings.description),
63
- supportedModes: ['navigation'],
64
- guidanceLevel: 3,
65
- requiredArtifacts: ['Trace', 'DevtoolsLog', 'URL', 'LinkElements', 'SourceMaps'],
66
- scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
67
- };
68
- }
69
-
70
- /**
71
- * Check if record has valid timing
72
- * @param {LH.Artifacts.NetworkRequest} record
73
- * @return {boolean}
74
- */
75
- static hasValidTiming(record) {
76
- return !!record.timing && record.timing.connectEnd >= 0 && record.timing.connectStart >= 0;
77
- }
78
-
79
- /**
80
- * Check is the connection is already open
81
- * @param {LH.Artifacts.NetworkRequest} record
82
- * @return {boolean}
83
- */
84
- static hasAlreadyConnectedToOrigin(record) {
85
- if (!record.timing) return false;
86
-
87
- // When these values are given as -1, that means the page has
88
- // a connection for this origin and paid these costs already.
89
- if (
90
- record.timing.dnsStart === -1 && record.timing.dnsEnd === -1 &&
91
- record.timing.connectStart === -1 && record.timing.connectEnd === -1
92
- ) {
93
- return true;
94
- }
95
-
96
- // Less understood: if the connection setup took no time at all, consider
97
- // it the same as the above. It is unclear if this is correct, or is even possible.
98
- if (
99
- record.timing.dnsEnd - record.timing.dnsStart === 0 &&
100
- record.timing.connectEnd - record.timing.connectStart === 0
101
- ) {
102
- return true;
103
- }
104
-
105
- return false;
106
- }
107
-
108
- /**
109
- * Check is the connection has started before the socket idle time
110
- * @param {LH.Artifacts.NetworkRequest} record
111
- * @param {LH.Artifacts.NetworkRequest} mainResource
112
- * @return {boolean}
113
- */
114
- static socketStartTimeIsBelowThreshold(record, mainResource) {
115
- const timeSinceMainEnd = Math.max(0, record.networkRequestTime - mainResource.networkEndTime);
116
- return timeSinceMainEnd < PRECONNECT_SOCKET_MAX_IDLE_IN_MS;
117
- }
118
-
119
- /**
120
- * @param {LH.Artifacts} artifacts
121
- * @param {LH.Audit.Context} context
122
- * @return {Promise<LH.Audit.Product>}
123
- */
124
- static async audit(artifacts, context) {
125
- const trace = artifacts.Trace;
126
- const devtoolsLog = artifacts.DevtoolsLog;
127
- const {URL, SourceMaps} = artifacts;
128
- const settings = context.settings;
129
-
130
- let maxWastedLcp = 0;
131
- let maxWastedFcp = 0;
132
- /** @type {Array<LH.IcuMessage>} */
133
- const warnings = [];
134
-
135
- const [networkRecords, mainResource, loadSimulator, processedNavigation, pageGraph] =
136
- await Promise.all([
137
- NetworkRecords.request(devtoolsLog, context),
138
- MainResource.request({devtoolsLog, URL}, context),
139
- LoadSimulator.request({devtoolsLog, settings}, context),
140
- ProcessedNavigation.request(trace, context),
141
- PageDependencyGraph.request(
142
- {settings, trace, devtoolsLog, URL, SourceMaps, fromTrace: false}, context),
143
- ]);
144
-
145
- const {rtt, additionalRttByOrigin} = loadSimulator.getOptions();
146
- const lcpGraph =
147
- LanternLargestContentfulPaint.getPessimisticGraph(pageGraph, processedNavigation);
148
- /** @type {Set<string>} */
149
- const lcpGraphURLs = new Set();
150
- lcpGraph.traverse(node => {
151
- if (node.type === 'network') lcpGraphURLs.add(node.request.url);
152
- });
153
-
154
- const fcpGraph =
155
- LanternFirstContentfulPaint.getPessimisticGraph(pageGraph, processedNavigation);
156
- const fcpGraphURLs = new Set();
157
- fcpGraph.traverse(node => {
158
- if (node.type === 'network') fcpGraphURLs.add(node.request.url);
159
- });
160
-
161
- /** @type {Map<string, LH.Artifacts.NetworkRequest[]>} */
162
- const origins = new Map();
163
- networkRecords
164
- .forEach(record => {
165
- if (
166
- // Filter out all resources where timing info was invalid.
167
- !UsesRelPreconnectAudit.hasValidTiming(record) ||
168
- // Filter out all resources that are loaded by the document. Connections are already early.
169
- record.initiator.url === mainResource.url ||
170
- // Filter out urls that do not have an origin (data, file, etc).
171
- !record.parsedURL || !record.parsedURL.securityOrigin ||
172
- // Filter out all resources that have the same origin. We're already connected.
173
- mainResource.parsedURL.securityOrigin === record.parsedURL.securityOrigin ||
174
- // Filter out anything that wasn't part of LCP. Only recommend important origins.
175
- !lcpGraphURLs.has(record.url) ||
176
- // Filter out all resources where origins are already resolved.
177
- UsesRelPreconnectAudit.hasAlreadyConnectedToOrigin(record) ||
178
- // Make sure the requests are below the PRECONNECT_SOCKET_MAX_IDLE_IN_MS (15s) mark.
179
- !UsesRelPreconnectAudit.socketStartTimeIsBelowThreshold(record, mainResource)
180
- ) {
181
- return;
182
- }
183
-
184
- const securityOrigin = record.parsedURL.securityOrigin;
185
- const records = origins.get(securityOrigin) || [];
186
- records.push(record);
187
- origins.set(securityOrigin, records);
188
- });
189
-
190
- const preconnectLinks = artifacts.LinkElements.filter(el => el.rel === 'preconnect');
191
- const preconnectOrigins =
192
- new Set(preconnectLinks.map(link => UrlUtils.getOrigin(link.href || '')));
193
-
194
- /** @type {Array<{url: string, wastedMs: number}>}*/
195
- let results = [];
196
- origins.forEach(records => {
197
- // Sometimes requests are done simultaneous and the connection has not been made
198
- // chrome will try to connect for each network record, we get the first record
199
- const firstRecordOfOrigin = records.reduce((firstRecord, record) => {
200
- return (record.networkRequestTime < firstRecord.networkRequestTime) ? record : firstRecord;
201
- });
202
-
203
- // Skip the origin if we don't have timing information
204
- if (!firstRecordOfOrigin.timing) return;
205
-
206
- const securityOrigin = firstRecordOfOrigin.parsedURL.securityOrigin;
207
-
208
- // Approximate the connection time with the duration of TCP (+potentially SSL) handshake
209
- // DNS time can be large but can also be 0 if a commonly used origin that's cached, so make
210
- // no assumption about DNS.
211
- const additionalRtt = additionalRttByOrigin.get(securityOrigin) || 0;
212
- let connectionTime = rtt + additionalRtt;
213
- // TCP Handshake will be at least 2 RTTs for TLS connections
214
- if (firstRecordOfOrigin.parsedURL.scheme === 'https') connectionTime = connectionTime * 2;
215
-
216
- const timeBetweenMainResourceAndDnsStart =
217
- firstRecordOfOrigin.networkRequestTime -
218
- mainResource.networkEndTime +
219
- firstRecordOfOrigin.timing.dnsStart;
220
-
221
- const wastedMs = Math.min(connectionTime, timeBetweenMainResourceAndDnsStart);
222
- if (wastedMs < IGNORE_THRESHOLD_IN_MS) return;
223
-
224
- if (preconnectOrigins.has(securityOrigin)) {
225
- // Add a warning for any origin the user tried to preconnect to but failed
226
- warnings.push(str_(UIStrings.crossoriginWarning, {securityOrigin}));
227
- return;
228
- }
229
-
230
- maxWastedLcp = Math.max(wastedMs, maxWastedLcp);
231
-
232
- if (fcpGraphURLs.has(firstRecordOfOrigin.url)) {
233
- maxWastedFcp = Math.max(wastedMs, maxWastedLcp);
234
- }
235
- results.push({
236
- url: securityOrigin,
237
- wastedMs: wastedMs,
238
- });
239
- });
240
-
241
- results = results
242
- .sort((a, b) => b.wastedMs - a.wastedMs);
243
-
244
- // Add warnings for any preconnect origins that aren't being used.
245
- for (const origin of preconnectOrigins) {
246
- if (!origin) continue;
247
- if (networkRecords.some(record => origin === record.parsedURL.securityOrigin)) continue;
248
- warnings.push(str_(UIStrings.unusedWarning, {securityOrigin: origin}));
249
- }
250
-
251
- // Shortcut early with a pass when the user has already configured preconnect.
252
- // https://twitter.com/_tbansal/status/1197771385172480001
253
- if (preconnectLinks.length >= 2) {
254
- return {
255
- score: 1,
256
- warnings: preconnectLinks.length >= 3 ?
257
- [...warnings, str_(UIStrings.tooManyPreconnectLinksWarning)] : warnings,
258
- metricSavings: {LCP: maxWastedLcp, FCP: maxWastedFcp},
259
- };
260
- }
261
-
262
- /** @type {LH.Audit.Details.Opportunity['headings']} */
263
- const headings = [
264
- {key: 'url', valueType: 'url', label: str_(i18n.UIStrings.columnURL)},
265
- {key: 'wastedMs', valueType: 'timespanMs', label: str_(i18n.UIStrings.columnWastedMs)},
266
- ];
267
-
268
- const details = Audit.makeOpportunityDetails(headings, results,
269
- {overallSavingsMs: maxWastedLcp, sortedBy: ['wastedMs']});
270
-
271
- return {
272
- score: results.length ? 0 : 1,
273
- numericValue: maxWastedLcp,
274
- numericUnit: 'millisecond',
275
- displayValue: maxWastedLcp ?
276
- str_(i18n.UIStrings.displayValueMsSavings, {wastedMs: maxWastedLcp}) :
277
- '',
278
- warnings,
279
- details,
280
- metricSavings: {LCP: maxWastedLcp, FCP: maxWastedFcp},
281
- };
282
- }
283
- }
284
-
285
- export default UsesRelPreconnectAudit;
286
- export {UIStrings};
@@ -1,57 +0,0 @@
1
- export default UsesRelPreloadAudit;
2
- declare class UsesRelPreloadAudit extends Audit {
3
- /**
4
- * @param {LH.Artifacts.NetworkRequest} mainResource
5
- * @param {LH.Gatherer.Simulation.GraphNode} graph
6
- * @return {Set<string>}
7
- */
8
- static getURLsToPreload(mainResource: LH.Artifacts.NetworkRequest, graph: LH.Gatherer.Simulation.GraphNode): Set<string>;
9
- /**
10
- * Finds which URLs were attempted to be preloaded, but failed to be reused and were requested again.
11
- *
12
- * @param {LH.Gatherer.Simulation.GraphNode} graph
13
- * @return {Set<string>}
14
- */
15
- static getURLsFailedToPreload(graph: LH.Gatherer.Simulation.GraphNode): Set<string>;
16
- /**
17
- * We want to preload all first party critical requests at depth 2.
18
- * Third party requests can be tricky to know the URL ahead of time.
19
- * Critical requests at depth 1 would already be identified by the browser for preloading.
20
- * Critical requests deeper than depth 2 are more likely to be a case-by-case basis such that it
21
- * would be a little risky to recommend blindly.
22
- *
23
- * @param {Lantern.Types.NetworkRequest} request
24
- * @param {Lantern.Types.NetworkRequest} mainResource
25
- * @param {Array<LH.Gatherer.Simulation.GraphNode>} initiatorPath
26
- * @return {boolean}
27
- */
28
- static shouldPreloadRequest(request: Lantern.Types.NetworkRequest, mainResource: Lantern.Types.NetworkRequest, initiatorPath: Array<LH.Gatherer.Simulation.GraphNode>): boolean;
29
- /**
30
- * Computes the estimated effect of preloading all the resources.
31
- * @param {Set<string>} urls The array of byte savings results per resource
32
- * @param {LH.Gatherer.Simulation.GraphNode} graph
33
- * @param {LH.Gatherer.Simulation.Simulator} simulator
34
- * @return {{wastedMs: number, results: Array<{url: string, wastedMs: number}>}}
35
- */
36
- static computeWasteWithGraph(urls: Set<string>, graph: LH.Gatherer.Simulation.GraphNode, simulator: LH.Gatherer.Simulation.Simulator): {
37
- wastedMs: number;
38
- results: Array<{
39
- url: string;
40
- wastedMs: number;
41
- }>;
42
- };
43
- /**
44
- * @param {LH.Artifacts} artifacts
45
- * @param {LH.Audit.Context} context
46
- * @return {Promise<LH.Audit.Product>}
47
- */
48
- static audit(artifacts: LH.Artifacts, context: LH.Audit.Context): Promise<LH.Audit.Product>;
49
- }
50
- export namespace UIStrings {
51
- let title: string;
52
- let description: string;
53
- let crossoriginWarning: string;
54
- }
55
- import { Audit } from './audit.js';
56
- import * as Lantern from '../lib/lantern/lantern.js';
57
- //# sourceMappingURL=uses-rel-preload.d.ts.map
@@ -1,263 +0,0 @@
1
- /**
2
- * @license
3
- * Copyright 2017 Google LLC
4
- * SPDX-License-Identifier: Apache-2.0
5
- */
6
-
7
- import * as Lantern from '../lib/lantern/lantern.js';
8
- import UrlUtils from '../lib/url-utils.js';
9
- import {NetworkRequest} from '../lib/network-request.js';
10
- import {Audit} from './audit.js';
11
- import {CriticalRequestChains} from '../computed/critical-request-chains.js';
12
- import * as i18n from '../lib/i18n/i18n.js';
13
- import {MainResource} from '../computed/main-resource.js';
14
- import {PageDependencyGraph} from '../computed/page-dependency-graph.js';
15
- import {LoadSimulator} from '../computed/load-simulator.js';
16
-
17
- const UIStrings = {
18
- /** Imperative title of a Lighthouse audit that tells the user to use <link rel=preload> to initiate important network requests earlier during page load. This is displayed in a list of audit titles that Lighthouse generates. */
19
- title: 'Preload key requests',
20
- /** Description of a Lighthouse audit that tells the user *why* they should preload important network requests. The associated network requests are started halfway through pageload (or later) but should be started at the beginning. This is displayed after a user expands the section to see more. No character length limits. '<link rel=preload>' is the html code the user would include in their page and shouldn't be translated. The last sentence starting with 'Learn' becomes link text to additional documentation. */
21
- description: 'Consider using `<link rel=preload>` to prioritize fetching resources that are ' +
22
- 'currently requested later in page load. ' +
23
- '[Learn how to preload key requests](https://developer.chrome.com/docs/lighthouse/performance/uses-rel-preload/).',
24
- /**
25
- * @description A warning message that is shown when the user tried to follow the advice of the audit, but it's not working as expected. Forgetting to set the `crossorigin` HTML attribute, or setting it to an incorrect value, on the link is a common mistake when adding preload links.
26
- * @example {https://example.com} preloadURL
27
- * */
28
- crossoriginWarning: 'A preload `<link>` was found for "{preloadURL}" but was not used ' +
29
- 'by the browser. Check that you are using the `crossorigin` attribute properly.',
30
- };
31
-
32
- const str_ = i18n.createIcuMessageFn(import.meta.url, UIStrings);
33
-
34
- const THRESHOLD_IN_MS = 100;
35
-
36
- class UsesRelPreloadAudit extends Audit {
37
- /**
38
- * @return {LH.Audit.Meta}
39
- */
40
- static get meta() {
41
- return {
42
- id: 'uses-rel-preload',
43
- title: str_(UIStrings.title),
44
- description: str_(UIStrings.description),
45
- supportedModes: ['navigation'],
46
- guidanceLevel: 3,
47
- requiredArtifacts: ['DevtoolsLog', 'Trace', 'URL', 'SourceMaps'],
48
- scoreDisplayMode: Audit.SCORING_MODES.METRIC_SAVINGS,
49
- };
50
- }
51
-
52
- /**
53
- * @param {LH.Artifacts.NetworkRequest} mainResource
54
- * @param {LH.Gatherer.Simulation.GraphNode} graph
55
- * @return {Set<string>}
56
- */
57
- static getURLsToPreload(mainResource, graph) {
58
- /** @type {Set<string>} */
59
- const urls = new Set();
60
-
61
- graph.traverse((node, traversalPath) => {
62
- if (node.type !== 'network') return;
63
- // Don't include the node itself or any CPU nodes in the initiatorPath
64
- const path = traversalPath.slice(1).filter(initiator => initiator.type === 'network');
65
- if (!UsesRelPreloadAudit.shouldPreloadRequest(node.request, mainResource, path)) return;
66
- urls.add(node.request.url);
67
- });
68
-
69
- return urls;
70
- }
71
-
72
- /**
73
- * Finds which URLs were attempted to be preloaded, but failed to be reused and were requested again.
74
- *
75
- * @param {LH.Gatherer.Simulation.GraphNode} graph
76
- * @return {Set<string>}
77
- */
78
- static getURLsFailedToPreload(graph) {
79
- // TODO: add `fromPrefetchCache` to Lantern.Types.NetworkRequest, then use node.request here instead of rawRequest.
80
- /** @type {Array<LH.Artifacts.NetworkRequest>} */
81
- const requests = [];
82
- graph.traverse(node => node.type === 'network' && requests.push(node.rawRequest));
83
-
84
- const preloadRequests = requests.filter(req => req.isLinkPreload);
85
- const preloadURLsByFrame = new Map();
86
- for (const request of preloadRequests) {
87
- const preloadURLs = preloadURLsByFrame.get(request.frameId) || new Set();
88
- preloadURLs.add(request.url);
89
- preloadURLsByFrame.set(request.frameId, preloadURLs);
90
- }
91
-
92
- // A failed preload attempt will manifest as a URL that was requested twice within the same frame.
93
- // Once with `isLinkPreload` AND again without `isLinkPreload` but not hitting the cache.
94
- const duplicateRequestsAfterPreload = requests.filter(request => {
95
- const preloadURLsForFrame = preloadURLsByFrame.get(request.frameId);
96
- if (!preloadURLsForFrame) return false;
97
- if (!preloadURLsForFrame.has(request.url)) return false;
98
- const fromCache = request.fromDiskCache ||
99
- request.fromMemoryCache ||
100
- request.fromPrefetchCache;
101
- return !fromCache && !request.isLinkPreload;
102
- });
103
-
104
- return new Set(duplicateRequestsAfterPreload.map(req => req.url));
105
- }
106
-
107
- /**
108
- * We want to preload all first party critical requests at depth 2.
109
- * Third party requests can be tricky to know the URL ahead of time.
110
- * Critical requests at depth 1 would already be identified by the browser for preloading.
111
- * Critical requests deeper than depth 2 are more likely to be a case-by-case basis such that it
112
- * would be a little risky to recommend blindly.
113
- *
114
- * @param {Lantern.Types.NetworkRequest} request
115
- * @param {Lantern.Types.NetworkRequest} mainResource
116
- * @param {Array<LH.Gatherer.Simulation.GraphNode>} initiatorPath
117
- * @return {boolean}
118
- */
119
- static shouldPreloadRequest(request, mainResource, initiatorPath) {
120
- const mainResourceDepth = mainResource.redirects ? mainResource.redirects.length : 0;
121
-
122
- // If it's already preloaded, no need to recommend it.
123
- if (request.isLinkPreload) return false;
124
- // It's not critical, don't recommend it.
125
- if (!CriticalRequestChains.isCritical(request, mainResource)) return false;
126
- // It's not a request loaded over the network, don't recommend it.
127
- if (NetworkRequest.isNonNetworkRequest(request)) return false;
128
- // It's not at the right depth, don't recommend it.
129
- if (initiatorPath.length !== mainResourceDepth + 2) return false;
130
- // It's not a request for the main frame, it wouldn't get reused even if you did preload it.
131
- if (request.frameId !== mainResource.frameId) return false;
132
- // We survived everything else, just check that it's a first party request.
133
- return UrlUtils.rootDomainsMatch(request.url, mainResource.url);
134
- }
135
-
136
- /**
137
- * Computes the estimated effect of preloading all the resources.
138
- * @param {Set<string>} urls The array of byte savings results per resource
139
- * @param {LH.Gatherer.Simulation.GraphNode} graph
140
- * @param {LH.Gatherer.Simulation.Simulator} simulator
141
- * @return {{wastedMs: number, results: Array<{url: string, wastedMs: number}>}}
142
- */
143
- static computeWasteWithGraph(urls, graph, simulator) {
144
- if (!urls.size) {
145
- return {wastedMs: 0, results: []};
146
- }
147
-
148
- // Preload changes the ordering of requests, simulate the original graph
149
- // to have a reasonable baseline for comparison.
150
- const simulationBeforeChanges = simulator.simulate(graph);
151
- const modifiedGraph = graph.cloneWithRelationships();
152
-
153
- /** @type {Array<LH.Gatherer.Simulation.GraphNetworkNode>} */
154
- const nodesToPreload = [];
155
- /** @type {LH.Gatherer.Simulation.GraphNode|null} */
156
- let mainDocumentNode = null;
157
- modifiedGraph.traverse(node => {
158
- if (node.type !== 'network') return;
159
-
160
- if (node.isMainDocument()) {
161
- mainDocumentNode = node;
162
- } else if (node.request && urls.has(node.request.url)) {
163
- nodesToPreload.push(node);
164
- }
165
- });
166
-
167
- if (!mainDocumentNode) {
168
- // Should always find the main document node
169
- throw new Error('Could not find main document node');
170
- }
171
-
172
- // Preload has the effect of moving the resource's only dependency to the main HTML document
173
- // Remove all dependencies of the nodes
174
- for (const node of nodesToPreload) {
175
- node.removeAllDependencies();
176
- node.addDependency(mainDocumentNode);
177
- }
178
-
179
- // Once we've modified the dependencies, simulate the new graph.
180
- const simulationAfterChanges = simulator.simulate(modifiedGraph);
181
- const originalNodesByRequest = Array.from(simulationBeforeChanges.nodeTimings.keys())
182
- // @ts-expect-error we don't care if all nodes without a request collect on `undefined`
183
- .reduce((map, node) => map.set(node.request, node), new Map());
184
-
185
- const results = [];
186
- for (const node of nodesToPreload) {
187
- const originalNode = originalNodesByRequest.get(node.request);
188
- const timingAfter = simulationAfterChanges.nodeTimings.get(node);
189
- const timingBefore = simulationBeforeChanges.nodeTimings.get(originalNode);
190
- if (!timingBefore || !timingAfter) throw new Error('Missing preload node');
191
-
192
- const wastedMs = Math.round(timingBefore.endTime - timingAfter.endTime);
193
- if (wastedMs < THRESHOLD_IN_MS) continue;
194
- results.push({url: node.request.url, wastedMs});
195
- }
196
-
197
- if (!results.length) {
198
- return {wastedMs: 0, results};
199
- }
200
-
201
- return {
202
- // Preload won't necessarily impact the deepest chain/overall time
203
- // We'll use the maximum endTime improvement for now
204
- wastedMs: Math.max(...results.map(item => item.wastedMs)),
205
- results,
206
- };
207
- }
208
-
209
- /**
210
- * @param {LH.Artifacts} artifacts
211
- * @param {LH.Audit.Context} context
212
- * @return {Promise<LH.Audit.Product>}
213
- */
214
- static async audit(artifacts, context) {
215
- const settings = context.settings;
216
- const trace = artifacts.Trace;
217
- const devtoolsLog = artifacts.DevtoolsLog;
218
- const {URL, SourceMaps} = artifacts;
219
- const simulatorOptions = {devtoolsLog, settings: context.settings};
220
-
221
- const [mainResource, graph, simulator] = await Promise.all([
222
- MainResource.request({devtoolsLog, URL}, context),
223
- PageDependencyGraph.request(
224
- {settings, trace, devtoolsLog, URL, SourceMaps, fromTrace: false}, context),
225
- LoadSimulator.request(simulatorOptions, context),
226
- ]);
227
-
228
- const urls = UsesRelPreloadAudit.getURLsToPreload(mainResource, graph);
229
- const {results, wastedMs} = UsesRelPreloadAudit.computeWasteWithGraph(urls, graph, simulator);
230
- // sort results by wastedTime DESC
231
- results.sort((a, b) => b.wastedMs - a.wastedMs);
232
-
233
- /** @type {Array<LH.IcuMessage>|undefined} */
234
- let warnings;
235
- const failedURLs = UsesRelPreloadAudit.getURLsFailedToPreload(graph);
236
- if (failedURLs.size) {
237
- warnings = Array.from(failedURLs)
238
- .map(preloadURL => str_(UIStrings.crossoriginWarning, {preloadURL}));
239
- }
240
-
241
- /** @type {LH.Audit.Details.Opportunity['headings']} */
242
- const headings = [
243
- {key: 'url', valueType: 'url', label: str_(i18n.UIStrings.columnURL)},
244
- {key: 'wastedMs', valueType: 'timespanMs', label: str_(i18n.UIStrings.columnWastedMs)},
245
- ];
246
- const details = Audit.makeOpportunityDetails(headings, results,
247
- {overallSavingsMs: wastedMs, sortedBy: ['wastedMs']});
248
-
249
- return {
250
- score: results.length ? 0 : 1,
251
- numericValue: wastedMs,
252
- numericUnit: 'millisecond',
253
- displayValue: wastedMs ?
254
- str_(i18n.UIStrings.displayValueMsSavings, {wastedMs}) :
255
- '',
256
- details,
257
- warnings,
258
- };
259
- }
260
- }
261
-
262
- export default UsesRelPreloadAudit;
263
- export {UIStrings};
@@ -1,17 +0,0 @@
1
- export default Viewport;
2
- declare class Viewport extends Audit {
3
- /**
4
- * @param {LH.Artifacts} artifacts
5
- * @param {LH.Audit.Context} context
6
- * @return {Promise<LH.Audit.Product>}
7
- */
8
- static audit(artifacts: LH.Artifacts, context: LH.Audit.Context): Promise<LH.Audit.Product>;
9
- }
10
- export namespace UIStrings {
11
- let title: string;
12
- let failureTitle: string;
13
- let description: string;
14
- let explanationNoTag: string;
15
- }
16
- import { Audit } from './audit.js';
17
- //# sourceMappingURL=viewport.d.ts.map