chrome-devtools-frontend 1.0.1524741 → 1.0.1526203

package/front_end/models/ai_assistance/data_formatters/PerformanceInsightFormatter.snapshot.txt

@@ -55,6 +55,7 @@ We can break this time down into the 4 phases that combine to make the LCP time:
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/lcp-breakdown
 - https://web.dev/articles/lcp
 - https://web.dev/articles/optimize-lcp
 === end content
@@ -100,6 +101,7 @@ We can break this time down into the 4 phases that combine to make the LCP time:
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/lcp-breakdown
 - https://web.dev/articles/lcp
 - https://web.dev/articles/optimize-lcp
 === end content
@@ -123,6 +125,7 @@ We can break this time down into the 2 phases that combine to make the LCP time:
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/lcp-breakdown
 - https://web.dev/articles/lcp
 - https://web.dev/articles/optimize-lcp
 === end content
@@ -140,6 +143,7 @@ There are no network requests that are render blocking.
 ## Estimated savings: FCP 0 ms, LCP 0 ms
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/render-blocking
 - https://web.dev/articles/lcp
 - https://web.dev/articles/optimize-lcp
 === end content
@@ -168,6 +172,7 @@ allUrls = [0: https://code.jquery.com/jquery-3.7.1.js, 1: http://localhost:8000/
 ## Estimated savings: FCP 2015 ms, LCP 0 ms
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/render-blocking
 - https://web.dev/articles/lcp
 - https://web.dev/articles/optimize-lcp
 === end content
@@ -227,6 +232,7 @@ The result of the checks for this insight are:
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/lcp-discovery
 - https://web.dev/articles/lcp
 - https://web.dev/articles/optimize-lcp
 === end content
@@ -288,6 +294,7 @@ The result of the checks for this insight are:
 ## Estimated savings: FCP 3428 ms, LCP 3428 ms
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/document-latency
 - https://web.dev/articles/optimize-ttfb
 === end content
 
@@ -334,6 +341,7 @@ Layout shifts in this cluster:
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/cls-culprit
 - https://web.dev/articles/cls
 - https://web.dev/articles/optimize-cls
 === end content
@@ -354,6 +362,7 @@ No layout shifts were found.
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/cls-culprit
 - https://web.dev/articles/cls
 - https://web.dev/articles/optimize-cls
 === end content
@@ -432,6 +441,7 @@ Layout shifts in this cluster:
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/cls-culprit
 - https://web.dev/articles/cls
 - https://web.dev/articles/optimize-cls
 === end content
@@ -463,6 +473,7 @@ The longest interaction on the page was a `click` which had a total duration of
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/inp-breakdown
 - https://web.dev/articles/inp
 - https://web.dev/explore/how-to-optimize-inp
 - https://web.dev/articles/optimize-long-tasks
@@ -489,6 +500,7 @@ There are no requests that were served over a legacy HTTP protocol.
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/modern-http
 - https://developer.chrome.com/docs/lighthouse/best-practices/uses-http2
 === end content
 
@@ -526,6 +538,7 @@ allUrls = [0: https://ads.jetpackdigital.com/sites/_uploads/1742278386bg_opt_640
 ## Estimated savings: FCP 0 ms, LCP 0 ms
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/modern-http
 - https://developer.chrome.com/docs/lighthouse/best-practices/uses-http2
 === end content
 
@@ -546,6 +559,7 @@ No DOM size issues were detected.
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/dom-size
 - https://developer.chrome.com/docs/lighthouse/performance/dom-size/
 === end content
 
@@ -561,7 +575,7 @@ This insight evaluates some key metrics about the Document Object Model (DOM) an
 - The largest layout and style recalculation events.
 
 ## Detailed analysis:
-A large DOM can increase the duration of style calculations and layout reflows, impacting page responsiveness. A large DOM will also increase memory usage. [Learn how to avoid an excessive DOM size](https://developer.chrome.com/docs/lighthouse/performance/dom-size/).
+A large DOM can increase the duration of style calculations and layout reflows, impacting page responsiveness. A large DOM will also increase memory usage. [Learn how to avoid an excessive DOM size](https://developer.chrome.com/docs/performance/insights/dom-size).
 
 Statistic:
 
@@ -577,6 +591,7 @@ Large layout updates/style calculations:
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/dom-size
 - https://developer.chrome.com/docs/lighthouse/performance/dom-size/
 === end content
 
@@ -636,6 +651,7 @@ Duplication grouped by Node modules: - Source: node_modules/filestack-js - Dupli
 ## Estimated savings: FCP 100 ms, LCP 100 ms
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/duplicated-javascript
 === end content
 
 Title: PerformanceInsightFormatter Duplicated javascript serializes no details if there is no duplicate javascript
@@ -652,6 +668,7 @@ There is no duplicated JavaScript in the page modules
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/duplicated-javascript
 === end content
 
 Title: PerformanceInsightFormatter Legacy JavaScript serializes the correct details when there is no legacy javascript in modules
@@ -669,6 +686,7 @@ There is no significant amount of legacy JavaScript on the page.
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/legacy-javascript
 - https://web.dev/articles/baseline-and-polyfills
 - https://philipwalton.com/articles/the-state-of-es5-on-the-web/
 === end content
@@ -735,6 +753,7 @@ Line: 0, Column: 390688, Name: Object.values
 ## Estimated savings: FCP 0 ms, LCP 0 ms
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/legacy-javascript
 - https://web.dev/articles/baseline-and-polyfills
 - https://philipwalton.com/articles/the-state-of-es5-on-the-web/
 === end content
@@ -752,6 +771,7 @@ No font display issues were detected.
 ## Estimated savings: FCP -Infinity ms
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/font-display
 - https://web.dev/articles/preload-optional-fonts
 - https://fonts.google.com/knowledge/glossary/foit
 - https://developer.chrome.com/blog/font-fallbacks
@@ -774,11 +794,12 @@ The following font display issues were found:
  - Font name: EJRVQgYoZZY2vCFuvAFWzr-_dSb_.woff2, URL: https://fonts.gstatic.com/s/ptserif/v18/EJRVQgYoZZY2vCFuvAFWzr-_dSb_.woff2 (eventKey: s-5325, ts: 409057959655), Property 'font-display' set to: 'auto', Wasted time: 15 ms.
  - Font name: S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2, URL: https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2 (eventKey: s-5238, ts: 409057956530), Property 'font-display' set to: 'auto', Wasted time: 10 ms.
 
-Consider setting [`font-display`](https://developer.chrome.com/blog/font-display) to `swap` or `optional` to ensure text is consistently visible. `swap` can be further optimized to mitigate layout shifts with [font metric overrides](https://developer.chrome.com/blog/font-fallbacks).
+Consider setting [`font-display`](https://developer.chrome.com/docs/performance/insights/font-display) to `swap` or `optional` to ensure text is consistently visible. `swap` can be further optimized to mitigate layout shifts with [font metric overrides](https://developer.chrome.com/blog/font-fallbacks).
 
 ## Estimated savings: FCP 20 ms
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/font-display
 - https://web.dev/articles/preload-optional-fonts
 - https://fonts.google.com/knowledge/glossary/foit
 - https://developer.chrome.com/blog/font-fallbacks
@@ -797,6 +818,7 @@ There are no unoptimized images on this page.
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/image-delivery
 - https://developer.chrome.com/docs/lighthouse/performance/uses-optimized-images/
 === end content
 
@@ -841,6 +863,7 @@ This image file is larger than it needs to be (2048x1356) for its displayed dime
 ## Estimated savings: FCP 0 ms, LCP 100 ms
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/image-delivery
 - https://developer.chrome.com/docs/lighthouse/performance/uses-optimized-images/
 === end content
 
@@ -852,13 +875,14 @@ Content:
 This insight identifies forced synchronous layouts (also known as forced reflows) and layout thrashing caused by JavaScript accessing layout properties at suboptimal points in time.
 
 ## Detailed analysis:
-A forced reflow occurs when JavaScript queries geometric properties (such as `offsetWidth`) after styles have been invalidated by a change to the DOM state. This can result in poor performance. Learn more about [forced reflows](https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing#avoid-forced-synchronous-layouts) and possible mitigations.
+A forced reflow occurs when JavaScript queries geometric properties (such as `offsetWidth`) after styles have been invalidated by a change to the DOM state. This can result in poor performance. Learn more about [forced reflows](https://developer.chrome.com/docs/performance/insights/forced-reflow) and possible mitigations.
 
 The forced reflow checks revealed no problems.
 
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/forced-reflow
 - https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing#avoid-forced-synchronous-layouts
 === end content
 
@@ -870,7 +894,7 @@ Content:
 This insight identifies forced synchronous layouts (also known as forced reflows) and layout thrashing caused by JavaScript accessing layout properties at suboptimal points in time.
 
 ## Detailed analysis:
-A forced reflow occurs when JavaScript queries geometric properties (such as `offsetWidth`) after styles have been invalidated by a change to the DOM state. This can result in poor performance. Learn more about [forced reflows](https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing#avoid-forced-synchronous-layouts) and possible mitigations.
+A forced reflow occurs when JavaScript queries geometric properties (such as `offsetWidth`) after styles have been invalidated by a change to the DOM state. This can result in poor performance. Learn more about [forced reflows](https://developer.chrome.com/docs/performance/insights/forced-reflow) and possible mitigations.
 
 The forced reflow checks revealed one or more problems.
 
@@ -901,6 +925,7 @@ Stack trace (including total time):
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/forced-reflow
 - https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing#avoid-forced-synchronous-layouts
 === end content
 
@@ -927,6 +952,7 @@ no origins were preconnected.
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/network-dependency-tree
 - https://web.dev/learn/performance/understanding-the-critical-path
 - https://developer.chrome.com/docs/lighthouse/performance/uses-rel-preconnect/
 === end content
@@ -959,6 +985,7 @@ no origins were preconnected.
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/network-dependency-tree
 - https://web.dev/learn/performance/understanding-the-critical-path
 - https://developer.chrome.com/docs/lighthouse/performance/uses-rel-preconnect/
 === end content
@@ -976,6 +1003,7 @@ No CSS selector data was found. CSS selector stats need to be enabled in the per
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/slow-css-selector
 - https://developer.chrome.com/docs/devtools/performance/selector-stats
 === end content
 
@@ -997,11 +1025,12 @@ Elapsed time: 0 ms
 Match attempts: 2444
 Match count: 465
 
-If Recalculate Style costs remain high, selector optimization can reduce them. [Optimize the selectors](https://developer.chrome.com/docs/devtools/performance/selector-stats) with both high elapsed time and high slow-path %. Simpler selectors, fewer selectors, a smaller DOM, and a shallower DOM will all reduce matching costs.
+If Recalculate Style costs remain high, selector optimization can reduce them. [Optimize the selectors](https://developer.chrome.com/docs/performance/insights/slow-css-selector) with both high elapsed time and high slow-path %. Simpler selectors, fewer selectors, a smaller DOM, and a shallower DOM will all reduce matching costs.
 
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/slow-css-selector
 - https://developer.chrome.com/docs/devtools/performance/selector-stats
 === end content
 
@@ -1018,6 +1047,7 @@ No 3rd party scripts were found on this page.
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/third-parties
 - https://web.dev/articles/optimizing-content-efficiency-loading-third-party-javascript/
 === end content
 
@@ -1043,11 +1073,12 @@ The following list contains the largest amount spent by a 3rd party script on th
 - noondiphcddnnabmjcihcjfbhfklnnep: 2 ms
 - web.app: 0.2 ms
 
-3rd party code can significantly impact load performance. [Reduce and defer loading of 3rd party code](https://web.dev/articles/optimizing-content-efficiency-loading-third-party-javascript/) to prioritize your page's content.
+3rd party code can significantly impact load performance. [Reduce and defer loading of 3rd party code](https://developer.chrome.com/docs/performance/insights/third-parties) to prioritize your page's content.
 
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/third-parties
 - https://web.dev/articles/optimizing-content-efficiency-loading-third-party-javascript/
 === end content
 
@@ -1064,6 +1095,7 @@ No requests with inefficient cache policies.
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/cache
 - https://web.dev/uses-long-cache-ttl/
 === end content
 
@@ -1081,11 +1113,12 @@ The following resources were associated with ineffficient cache policies:
   - Cache Time to Live (TTL): 600 seconds
   - Wasted bytes: 0 B
 
-A long cache lifetime can speed up repeat visits to your page. [Learn more](https://web.dev/uses-long-cache-ttl/).
+A long cache lifetime can speed up repeat visits to your page. [Learn more about caching](https://developer.chrome.com/docs/performance/insights/cache).
 
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/cache
 - https://web.dev/uses-long-cache-ttl/
 === end content
 
@@ -1104,6 +1137,7 @@ The viewport meta tag was found: `width=device-width, initial-scale=0.25`.
 ## Estimated savings: INP 0 ms
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/viewport
 - https://developer.chrome.com/blog/300ms-tap-delay-gone-away/
 === end content
 
@@ -1119,10 +1153,11 @@ The webpage is not optimized for mobile viewing.
 
 The viewport meta tag is missing.
 
-Tap interactions may be [delayed by up to 300 ms](https://developer.chrome.com/blog/300ms-tap-delay-gone-away/) if the viewport is not optimized for mobile.
+Tap interactions may be [delayed by up to 300 ms](https://developer.chrome.com/docs/performance/insights/viewport) if the viewport is not optimized for mobile.
 
 ## Estimated savings: none
 
 ## External resources:
+- https://developer.chrome.com/docs/performance/insights/viewport
 - https://developer.chrome.com/blog/300ms-tap-delay-gone-away/
 === end content

package/front_end/models/ai_assistance/data_formatters/PerformanceInsightFormatter.ts

@@ -1009,55 +1009,73 @@ ${this.#links()}`;
   }
 
   #links(): string {
+    const links = [];
+
+    if (this.#insight.docs) {
+      links.push(this.#insight.docs);
+    }
+
     switch (this.#insight.insightKey) {
       case 'CLSCulprits':
-        return `- https://web.dev/articles/cls
-- https://web.dev/articles/optimize-cls`;
+        links.push('https://web.dev/articles/cls');
+        links.push('https://web.dev/articles/optimize-cls');
+        break;
       case 'DocumentLatency':
-        return '- https://web.dev/articles/optimize-ttfb';
+        links.push('https://web.dev/articles/optimize-ttfb');
+        break;
       case 'DOMSize':
-        return '- https://developer.chrome.com/docs/lighthouse/performance/dom-size/';
-      case 'DuplicatedJavaScript':
-        return '';
+        links.push('https://developer.chrome.com/docs/lighthouse/performance/dom-size/');
+        break;
       case 'FontDisplay':
-        return `- https://web.dev/articles/preload-optional-fonts
-- https://fonts.google.com/knowledge/glossary/foit
-- https://developer.chrome.com/blog/font-fallbacks`;
+        links.push('https://web.dev/articles/preload-optional-fonts');
+        links.push('https://fonts.google.com/knowledge/glossary/foit');
+        links.push('https://developer.chrome.com/blog/font-fallbacks');
+        break;
       case 'ForcedReflow':
-        return '- https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing#avoid-forced-synchronous-layouts';
+        links.push(
+            'https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing#avoid-forced-synchronous-layouts');
+        break;
       case 'ImageDelivery':
-        return '- https://developer.chrome.com/docs/lighthouse/performance/uses-optimized-images/';
+        links.push('https://developer.chrome.com/docs/lighthouse/performance/uses-optimized-images/');
+        break;
       case 'INPBreakdown':
-        return `- https://web.dev/articles/inp
-- https://web.dev/explore/how-to-optimize-inp
-- https://web.dev/articles/optimize-long-tasks
-- https://web.dev/articles/avoid-large-complex-layouts-and-layout-thrashing`;
-      case 'LCPDiscovery':
-        return `- https://web.dev/articles/lcp
-- https://web.dev/articles/optimize-lcp`;
+        links.push('https://web.dev/articles/inp');
+        links.push('https://web.dev/explore/how-to-optimize-inp');
+        links.push('https://web.dev/articles/optimize-long-tasks');
+        links.push('https://web.dev/articles/avoid-large-complex-layouts-and-layout-thrashing');
+        break;
       case 'LCPBreakdown':
-        return `- https://web.dev/articles/lcp
-- https://web.dev/articles/optimize-lcp`;
-      case 'NetworkDependencyTree':
-        return `- https://web.dev/learn/performance/understanding-the-critical-path
-- https://developer.chrome.com/docs/lighthouse/performance/uses-rel-preconnect/`;
+      case 'LCPDiscovery':
       case 'RenderBlocking':
-        return `- https://web.dev/articles/lcp
-- https://web.dev/articles/optimize-lcp`;
+        links.push('https://web.dev/articles/lcp');
+        links.push('https://web.dev/articles/optimize-lcp');
+        break;
+      case 'NetworkDependencyTree':
+        links.push('https://web.dev/learn/performance/understanding-the-critical-path');
+        links.push('https://developer.chrome.com/docs/lighthouse/performance/uses-rel-preconnect/');
+        break;
       case 'SlowCSSSelector':
-        return '- https://developer.chrome.com/docs/devtools/performance/selector-stats';
+        links.push('https://developer.chrome.com/docs/devtools/performance/selector-stats');
+        break;
       case 'ThirdParties':
-        return '- https://web.dev/articles/optimizing-content-efficiency-loading-third-party-javascript/';
+        links.push('https://web.dev/articles/optimizing-content-efficiency-loading-third-party-javascript/');
+        break;
       case 'Viewport':
-        return '- https://developer.chrome.com/blog/300ms-tap-delay-gone-away/';
+        links.push('https://developer.chrome.com/blog/300ms-tap-delay-gone-away/');
+        break;
       case 'Cache':
-        return '- https://web.dev/uses-long-cache-ttl/';
+        links.push('https://web.dev/uses-long-cache-ttl/');
+        break;
       case 'ModernHTTP':
-        return '- https://developer.chrome.com/docs/lighthouse/best-practices/uses-http2';
+        links.push('https://developer.chrome.com/docs/lighthouse/best-practices/uses-http2');
+        break;
       case 'LegacyJavaScript':
-        return `- https://web.dev/articles/baseline-and-polyfills
-- https://philipwalton.com/articles/the-state-of-es5-on-the-web/`;
+        links.push('https://web.dev/articles/baseline-and-polyfills');
+        links.push('https://philipwalton.com/articles/the-state-of-es5-on-the-web/');
+        break;
     }
+
+    return links.map(link => '- ' + link).join('\n');
   }
 
   #description(): string {