chrome-devtools-frontend 1.0.1608868 → 1.0.1609381

package/front_end/models/ai_assistance/agents/StylingAgent.ts

@@ -75,7 +75,7 @@ First, examine the provided context, then use the functions to gather additional
 * Use the precision of Strunk & White, the brevity of Hemingway, and the simple clarity of Vonnegut. Don't add repeated information, and keep the whole answer short.
 * **CRITICAL** NEVER write full Python programs - you should only write individual statements that invoke a single function from the provided library.
 * **CRITICAL** NEVER output text before a function call. Always do a function call first.
-* **CRITICAL** When answering questions about positioning or layout, ALWAYS inspect \`position\`, \`display\` and ALL related properties.
+* **CRITICAL** When answering questions about positioning or layout, ALWAYS inspect \`position\`, \`display\` and all other related properties. You MUST provide a specific list of CSS property names when calling functions to get styles. Do not use generic values like "all" or "*".
 * **CRITICAL** You are a CSS/DOM/HTML debugging assistant. NEVER provide answers to questions of unrelated topics such as legal advice, financial advice, personal opinions, medical advice, religion, race, politics, sexuality, gender, or any other non web-development topics. Answer "Sorry, I can't answer that. I'm best at questions about debugging web pages." to such questions.
 
 ## Response Structure
@@ -308,7 +308,8 @@ export class StylingAgent extends AiAgent<SDK.DOMModel.DOMNode> {
 
 **CRITICAL** An element uid is a number, not a selector.
 **CRITICAL** Use selectors to refer to elements in the text output. Do not use uids.
-**CRITICAL** Always provide the explanation argument to explain what and why you query.`,
+**CRITICAL** Always provide the explanation argument to explain what and why you query.
+**CRITICAL** You MUST provide a specific list of CSS property names. Do not use generic values like "all" or "*".`,
       parameters: {
         type: Host.AidaClient.ParametersTypes.OBJECT,
         description: '',
@@ -327,7 +328,8 @@ export class StylingAgent extends AiAgent<SDK.DOMModel.DOMNode> {
           },
           styleProperties: {
             type: Host.AidaClient.ParametersTypes.ARRAY,
-            description: 'One or more CSS style property names to fetch.',
+            description:
+                'One or more specific CSS style property names to fetch. Generic values like "all" or "*" are not supported.',
             nullable: false,
             items: {
               type: Host.AidaClient.ParametersTypes.STRING,

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

@@ -474,7 +474,7 @@ Here are all the insights that contain some related request from the given range
 Title: PerformanceTraceFormatter formatTraceSummary web-dev.json.gz
 Content:
 URL: https://web.dev/cls/
-Trace bounds: {min: 1020034823047, max: 1020036087961}
+Trace bounds: {min: 1020034823047µs, max: 1020036087961µs}
 CPU throttling: none
 Network throttling: none
 
@@ -485,42 +485,42 @@ The following is a list of insight sets. An insight set covers a specific part o
 ## insight set id: NAVIGATION_0
 
 URL: https://web.dev/cls/
-Bounds: {min: 1020034834921, max: 1020036087961}
+Bounds: {min: 1020034834921µs, max: 1020036087961µs}
 Metrics (lab / observed):
   - LCP: 118 ms, event: (eventKey: r-1802, ts: 1020034953358), nodeId: 209
   - LCP breakdown:
-    - TTFB: 31 ms, bounds: {min: 1020034834921, max: 1020034866264}
-    - Render delay: 87 ms, bounds: {min: 1020034866264, max: 1020034953358}
+    - TTFB: 31 ms, bounds: {min: 1020034834921µs, max: 1020034866264µs}
+    - Render delay: 87 ms, bounds: {min: 1020034866264µs, max: 1020034953358µs}
   - CLS: 0.00
 Metrics (field / real users): n/a – no data for this page in CrUX
 Available insights:
   - insight name: LCPBreakdown
     description: Each [subpart has specific improvement strategies](https://developer.chrome.com/docs/performance/insights/lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays.
-    relevant trace bounds: {min: 1020034834921, max: 1020034953358}
+    relevant trace bounds: {min: 1020034834921µs, max: 1020034953358µs}
     example question: Help me optimize my LCP score
     example question: Which LCP phase was most problematic?
     example question: What can I do to reduce the LCP time for this page load?
   - insight name: DocumentLatency
     description: Your first network request is the most important. [Reduce its latency](https://developer.chrome.com/docs/performance/insights/document-latency) by avoiding redirects, ensuring a fast server response, and enabling text compression.
-    relevant trace bounds: {min: 1020034836013, max: 1020034892491}
+    relevant trace bounds: {min: 1020034836013µs, max: 1020034892491µs}
     estimated metric savings: FCP 0 ms, LCP 0 ms
     estimated wasted bytes: 52.1 kB
     example question: How do I decrease the initial loading time of my page?
     example question: Did anything slow down the request for this document?
   - insight name: ThirdParties
     description: 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.
-    relevant trace bounds: {min: 1020034871372, max: 1020035171789}
+    relevant trace bounds: {min: 1020034871372µs, max: 1020035171789µs}
     example question: Which third parties are having the largest impact on my page performance?
   - insight name: CharacterSet
     description: A character encoding declaration is required. It can be done with a meta charset tag in the first 1024 bytes of the HTML or in the Content-Type HTTP response header. [Learn more about declaring the character encoding](https://developer.chrome.com/docs/insights/charset/).
-    relevant trace bounds: {min: 1020034836013, max: 1020034892491}
+    relevant trace bounds: {min: 1020034836013µs, max: 1020034892491µs}
     example question: How do I declare a character encoding for my page?
 === end content
 
 Title: PerformanceTraceFormatter formatTraceSummary yahoo-news.json.gz
 Content:
 URL: https://news.yahoo.com/
-Trace bounds: {min: 157423484442, max: 157427277166}
+Trace bounds: {min: 157423484442µs, max: 157427277166µs}
 CPU throttling: none
 Network throttling: none
 
@@ -531,57 +531,57 @@ The following is a list of insight sets. An insight set covers a specific part o
 ## insight set id: NAVIGATION_0
 
 URL: https://news.yahoo.com/
-Bounds: {min: 157423488682, max: 157427277166}
+Bounds: {min: 157423488682µs, max: 157427277166µs}
 Metrics (lab / observed):
   - LCP: 464 ms, event: (eventKey: r-33210, ts: 157423953162), nodeId: 8
   - LCP breakdown:
-    - TTFB: 216 ms, bounds: {min: 157423488682, max: 157423704371}
-    - Load delay: 90 ms, bounds: {min: 157423704371, max: 157423794709}
-    - Load duration: 64 ms, bounds: {min: 157423794709, max: 157423858674}
-    - Render delay: 94 ms, bounds: {min: 157423858674, max: 157423953162}
+    - TTFB: 216 ms, bounds: {min: 157423488682µs, max: 157423704371µs}
+    - Load delay: 90 ms, bounds: {min: 157423704371µs, max: 157423794709µs}
+    - Load duration: 64 ms, bounds: {min: 157423794709µs, max: 157423858674µs}
+    - Render delay: 94 ms, bounds: {min: 157423858674µs, max: 157423953162µs}
   - CLS: 0.04, event: (eventKey: s-166266, ts: 157425604232)
 Metrics (field / real users): n/a – no data for this page in CrUX
 Available insights:
   - insight name: LCPBreakdown
     description: Each [subpart has specific improvement strategies](https://developer.chrome.com/docs/performance/insights/lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays.
-    relevant trace bounds: {min: 157423488682, max: 157423953162}
+    relevant trace bounds: {min: 157423488682µs, max: 157423953162µs}
     example question: Help me optimize my LCP score
     example question: Which LCP phase was most problematic?
     example question: What can I do to reduce the LCP time for this page load?
   - insight name: CLSCulprits
     description: Layout shifts occur when elements move absent any user interaction. [Investigate the causes of layout shifts](https://developer.chrome.com/docs/performance/insights/cls-culprit), such as elements being added, removed, or their fonts changing as the page loads.
-    relevant trace bounds: {min: 157425604232, max: 157426760958}
+    relevant trace bounds: {min: 157425604232µs, max: 157426760958µs}
     example question: Help me optimize my CLS score
     example question: How can I prevent layout shifts on this page?
   - insight name: NetworkDependencyTree
     description: [Avoid chaining critical requests](https://developer.chrome.com/docs/performance/insights/network-dependency-tree) by reducing the length of chains, reducing the download size of resources, or deferring the download of unnecessary resources to improve page load.
-    relevant trace bounds: {min: 157423489126, max: 157426527569}
+    relevant trace bounds: {min: 157423489126µs, max: 157426527569µs}
     example question: How do I optimize my network dependency tree?
   - insight name: ImageDelivery
     description: Reducing the download time of images can improve the perceived load time of the page and LCP. [Learn more about optimizing image size](https://developer.chrome.com/docs/performance/insights/image-delivery)
-    relevant trace bounds: {min: 157423794709, max: 157424082831}
+    relevant trace bounds: {min: 157423794709µs, max: 157424082831µs}
     estimated metric savings: FCP 0 ms, LCP 0 ms
     estimated wasted bytes: 97.8 kB
     example question: What should I do to improve and optimize the time taken to fetch and display images on the page?
     example question: Are all images on my site optimized?
   - insight name: FontDisplay
     description: 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).
-    relevant trace bounds: {min: 157425661196, max: 157425696387}
+    relevant trace bounds: {min: 157425661196µs, max: 157425696387µs}
     estimated metric savings: FCP 20 ms
     example question: How can I update my CSS to avoid layout shifts caused by incorrect `font-display` properties?
   - insight name: ThirdParties
     description: 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.
-    relevant trace bounds: {min: 157423742399, max: 157427277086}
+    relevant trace bounds: {min: 157423742399µs, max: 157427277086µs}
     example question: Which third parties are having the largest impact on my page performance?
   - insight name: Cache
     description: A long cache lifetime can speed up repeat visits to your page. [Learn more about caching](https://developer.chrome.com/docs/performance/insights/cache).
-    relevant trace bounds: {min: 157423742399, max: 157426980482}
+    relevant trace bounds: {min: 157423742399µs, max: 157426980482µs}
     estimated metric savings: FCP 0 ms, LCP 0 ms
     estimated wasted bytes: 847.4 kB
     example question: What caching strategies can I apply to improve my page performance?
   - insight name: LegacyJavaScript
     description: Polyfills and transforms enable older browsers to use new JavaScript features. However, many aren't necessary for modern browsers. Consider modifying your JavaScript build process to not transpile [Baseline](https://web.dev/articles/baseline-and-polyfills) features, unless you know you must support older browsers. [Learn why most sites can deploy ES6+ code without transpiling](https://developer.chrome.com/docs/performance/insights/legacy-javascript)
-    relevant trace bounds: {min: 157423489126, max: 157426132225}
+    relevant trace bounds: {min: 157423489126µs, max: 157426132225µs}
     estimated metric savings: FCP 0 ms, LCP 0 ms
     estimated wasted bytes: 126.9 kB
     example question: Is my site polyfilling modern JavaScript features?
@@ -591,7 +591,7 @@ Available insights:
 Title: PerformanceTraceFormatter formatTraceSummary multiple-navigations-render-blocking.json.gz
 Content:
 URL: http://localhost:8080/render-blocking
-Trace bounds: {min: 171605647473, max: 171616667355}
+Trace bounds: {min: 171605647473µs, max: 171616667355µs}
 CPU throttling: 1x
 Network throttling: Fast 3G
 
@@ -602,64 +602,64 @@ The following is a list of insight sets. An insight set covers a specific part o
 ## insight set id: NAVIGATION_0
 
 URL: http://localhost:8080/render-blocking
-Bounds: {min: 171607579779, max: 171613750571}
+Bounds: {min: 171607579779µs, max: 171613750571µs}
 Metrics (lab / observed):
   - LCP: 1317 ms, event: (eventKey: r-6686, ts: 171608897210), nodeId: 10
   - LCP breakdown:
-    - TTFB: 10 ms, bounds: {min: 171607579779, max: 171607589981.99997}
-    - Render delay: 1,307 ms, bounds: {min: 171607589981.99997, max: 171608897210}
+    - TTFB: 10 ms, bounds: {min: 171607579779µs, max: 171607589981.99997µs}
+    - Render delay: 1,307 ms, bounds: {min: 171607589981.99997µs, max: 171608897210µs}
   - CLS: 0.00
 Metrics (field / real users): n/a – no data for this page in CrUX
 Available insights:
   - insight name: LCPBreakdown
     description: Each [subpart has specific improvement strategies](https://developer.chrome.com/docs/performance/insights/lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays.
-    relevant trace bounds: {min: 171607579779, max: 171608897210}
+    relevant trace bounds: {min: 171607579779µs, max: 171608897210µs}
     example question: Help me optimize my LCP score
     example question: Which LCP phase was most problematic?
     example question: What can I do to reduce the LCP time for this page load?
   - insight name: RenderBlocking
     description: Requests are blocking the page's initial render, which may delay LCP. [Deferring or inlining](https://developer.chrome.com/docs/performance/insights/render-blocking) can move these network requests out of the critical path.
-    relevant trace bounds: {min: 171608170438, max: 171608877165}
+    relevant trace bounds: {min: 171608170438µs, max: 171608877165µs}
     example question: Show me the most impactful render-blocking requests that I should focus on
     example question: How can I reduce the number of render-blocking requests?
   - insight name: CharacterSet
     description: A character encoding declaration is required. It can be done with a meta charset tag in the first 1024 bytes of the HTML or in the Content-Type HTTP response header. [Learn more about declaring the character encoding](https://developer.chrome.com/docs/insights/charset/).
-    relevant trace bounds: {min: 171607584346, max: 171608171143}
+    relevant trace bounds: {min: 171607584346µs, max: 171608171143µs}
     example question: How do I declare a character encoding for my page?
 
 ## insight set id: NAVIGATION_1
 
 URL: http://localhost:8080/render-blocking
-Bounds: {min: 171613750571, max: 171616667355}
+Bounds: {min: 171613750571µs, max: 171616667355µs}
 Metrics (lab / observed):
   - LCP: 1310 ms, event: (eventKey: r-15639, ts: 171615060776), nodeId: 18
   - LCP breakdown:
-    - TTFB: 3 ms, bounds: {min: 171613750571, max: 171613753188}
-    - Render delay: 1,308 ms, bounds: {min: 171613753188, max: 171615060776}
+    - TTFB: 3 ms, bounds: {min: 171613750571µs, max: 171613753188µs}
+    - Render delay: 1,308 ms, bounds: {min: 171613753188µs, max: 171615060776µs}
   - CLS: 0.00
 Metrics (field / real users): n/a – no data for this page in CrUX
 Available insights:
   - insight name: LCPBreakdown
     description: Each [subpart has specific improvement strategies](https://developer.chrome.com/docs/performance/insights/lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays.
-    relevant trace bounds: {min: 171613750571, max: 171615060776}
+    relevant trace bounds: {min: 171613750571µs, max: 171615060776µs}
     example question: Help me optimize my LCP score
     example question: Which LCP phase was most problematic?
     example question: What can I do to reduce the LCP time for this page load?
   - insight name: RenderBlocking
     description: Requests are blocking the page's initial render, which may delay LCP. [Deferring or inlining](https://developer.chrome.com/docs/performance/insights/render-blocking) can move these network requests out of the critical path.
-    relevant trace bounds: {min: 171614330544, max: 171615043224}
+    relevant trace bounds: {min: 171614330544µs, max: 171615043224µs}
     example question: Show me the most impactful render-blocking requests that I should focus on
     example question: How can I reduce the number of render-blocking requests?
   - insight name: CharacterSet
     description: A character encoding declaration is required. It can be done with a meta charset tag in the first 1024 bytes of the HTML or in the Content-Type HTTP response header. [Learn more about declaring the character encoding](https://developer.chrome.com/docs/insights/charset/).
-    relevant trace bounds: {min: 171613750986, max: 171614330870}
+    relevant trace bounds: {min: 171613750986µs, max: 171614330870µs}
     example question: How do I declare a character encoding for my page?
 === end content
 
 Title: PerformanceTraceFormatter formatTraceSummary deals with CrUX manager errors
 Content:
 URL: http://localhost/image-delivery-cases.html
-Trace bounds: {min: 59728641874, max: 59734400108}
+Trace bounds: {min: 59728641874µs, max: 59734400108µs}
 CPU throttling: 1x
 Network throttling: No throttling
 
@@ -670,73 +670,73 @@ The following is a list of insight sets. An insight set covers a specific part o
 ## insight set id: NAVIGATION_0
 
 URL: http://localhost/image-delivery-cases.html
-Bounds: {min: 59728649746, max: 59734400108}
+Bounds: {min: 59728649746µs, max: 59734400108µs}
 Metrics (lab / observed):
   - LCP: 663 ms, event: (eventKey: r-14753, ts: 59729312744), nodeId: 12
   - LCP breakdown:
-    - TTFB: 7 ms, bounds: {min: 59728649746, max: 59728656735}
-    - Load delay: 46 ms, bounds: {min: 59728656735, max: 59728702313}
-    - Load duration: 506 ms, bounds: {min: 59728702313, max: 59729208600}
-    - Render delay: 104 ms, bounds: {min: 59729208600, max: 59729312744}
+    - TTFB: 7 ms, bounds: {min: 59728649746µs, max: 59728656735µs}
+    - Load delay: 46 ms, bounds: {min: 59728656735µs, max: 59728702313µs}
+    - Load duration: 506 ms, bounds: {min: 59728702313µs, max: 59729208600µs}
+    - Render delay: 104 ms, bounds: {min: 59729208600µs, max: 59729312744µs}
   - CLS: 0.31, event: (eventKey: s-14787, ts: 59729100192)
 Metrics (field / real users): n/a – no data for this page in CrUX
 Available insights:
   - insight name: Cache
     description: A long cache lifetime can speed up repeat visits to your page. [Learn more about caching](https://developer.chrome.com/docs/performance/insights/cache).
-    relevant trace bounds: {min: 59728702014, max: 59728867430}
+    relevant trace bounds: {min: 59728702014µs, max: 59728867430µs}
     estimated metric savings: FCP 0 ms, LCP 150 ms
     estimated wasted bytes: 971.5 kB
     example question: What caching strategies can I apply to improve my page performance?
   - insight name: ImageDelivery
     description: Reducing the download time of images can improve the perceived load time of the page and LCP. [Learn more about optimizing image size](https://developer.chrome.com/docs/performance/insights/image-delivery)
-    relevant trace bounds: {min: 59728701403, max: 59729395208}
+    relevant trace bounds: {min: 59728701403µs, max: 59729395208µs}
     estimated metric savings: FCP 0 ms, LCP 100 ms
     estimated wasted bytes: 2 MB
     example question: What should I do to improve and optimize the time taken to fetch and display images on the page?
     example question: Are all images on my site optimized?
   - insight name: LCPBreakdown
     description: Each [subpart has specific improvement strategies](https://developer.chrome.com/docs/performance/insights/lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays.
-    relevant trace bounds: {min: 59728649746, max: 59729312744}
+    relevant trace bounds: {min: 59728649746µs, max: 59729312744µs}
     example question: Help me optimize my LCP score
     example question: Which LCP phase was most problematic?
     example question: What can I do to reduce the LCP time for this page load?
   - insight name: LCPDiscovery
     description: [Optimize LCP](https://developer.chrome.com/docs/performance/insights/lcp-discovery) by making the LCP image discoverable from the HTML immediately, and avoiding lazy-loading
-    relevant trace bounds: {min: 59728656735, max: 59729209036}
+    relevant trace bounds: {min: 59728656735µs, max: 59729209036µs}
     example question: Suggest fixes to reduce my LCP
     example question: What can I do to reduce my LCP discovery time?
     example question: Why is LCP discovery time important?
   - insight name: CLSCulprits
     description: Layout shifts occur when elements move absent any user interaction. [Investigate the causes of layout shifts](https://developer.chrome.com/docs/performance/insights/cls-culprit), such as elements being added, removed, or their fonts changing as the page loads.
-    relevant trace bounds: {min: 59729100192, max: 59730317334}
+    relevant trace bounds: {min: 59729100192µs, max: 59730317334µs}
     example question: Help me optimize my CLS score
     example question: How can I prevent layout shifts on this page?
   - insight name: DocumentLatency
     description: Your first network request is the most important. [Reduce its latency](https://developer.chrome.com/docs/performance/insights/document-latency) by avoiding redirects, ensuring a fast server response, and enabling text compression.
-    relevant trace bounds: {min: 59728651057, max: 59728790724}
+    relevant trace bounds: {min: 59728651057µs, max: 59728790724µs}
     estimated metric savings: FCP 0 ms, LCP 0 ms
     estimated wasted bytes: 1.6 kB
     example question: How do I decrease the initial loading time of my page?
     example question: Did anything slow down the request for this document?
   - insight name: Viewport
     description: 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.
-    relevant trace bounds: {min: 59728649746, max: 59734400108}
+    relevant trace bounds: {min: 59728649746µs, max: 59734400108µs}
     estimated metric savings: INP 0 ms
     example question: How do I make sure my page is optimized for mobile viewing?
   - insight name: ThirdParties
     description: 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.
-    relevant trace bounds: {min: 59728701403, max: 59729465969}
+    relevant trace bounds: {min: 59728701403µs, max: 59729465969µs}
     example question: Which third parties are having the largest impact on my page performance?
   - insight name: CharacterSet
     description: A character encoding declaration is required. It can be done with a meta charset tag in the first 1024 bytes of the HTML or in the Content-Type HTTP response header. [Learn more about declaring the character encoding](https://developer.chrome.com/docs/insights/charset/).
-    relevant trace bounds: {min: 59728651057, max: 59728790724}
+    relevant trace bounds: {min: 59728651057µs, max: 59728790724µs}
     example question: How do I declare a character encoding for my page?
 === end content
 
 Title: PerformanceTraceFormatter formatTraceSummary image-delivery.json.gz
 Content:
 URL: http://localhost/image-delivery-cases.html
-Trace bounds: {min: 59728641874, max: 59734400108}
+Trace bounds: {min: 59728641874µs, max: 59734400108µs}
 CPU throttling: 1x
 Network throttling: No throttling
 
@@ -747,14 +747,14 @@ The following is a list of insight sets. An insight set covers a specific part o
 ## insight set id: NAVIGATION_0
 
 URL: http://localhost/image-delivery-cases.html
-Bounds: {min: 59728649746, max: 59734400108}
+Bounds: {min: 59728649746µs, max: 59734400108µs}
 Metrics (lab / observed):
   - LCP: 663 ms, event: (eventKey: r-14753, ts: 59729312744), nodeId: 12
   - LCP breakdown:
-    - TTFB: 7 ms, bounds: {min: 59728649746, max: 59728656735}
-    - Load delay: 46 ms, bounds: {min: 59728656735, max: 59728702313}
-    - Load duration: 506 ms, bounds: {min: 59728702313, max: 59729208600}
-    - Render delay: 104 ms, bounds: {min: 59729208600, max: 59729312744}
+    - TTFB: 7 ms, bounds: {min: 59728649746µs, max: 59728656735µs}
+    - Load delay: 46 ms, bounds: {min: 59728656735µs, max: 59728702313µs}
+    - Load duration: 506 ms, bounds: {min: 59728702313µs, max: 59729208600µs}
+    - Render delay: 104 ms, bounds: {min: 59729208600µs, max: 59729312744µs}
   - CLS: 0.31, event: (eventKey: s-14787, ts: 59729100192)
 Metrics (field / real users):
   - LCP: 1740 ms (scope: url)
@@ -767,60 +767,60 @@ Metrics (field / real users):
 Available insights:
   - insight name: Cache
     description: A long cache lifetime can speed up repeat visits to your page. [Learn more about caching](https://developer.chrome.com/docs/performance/insights/cache).
-    relevant trace bounds: {min: 59728702014, max: 59728867430}
+    relevant trace bounds: {min: 59728702014µs, max: 59728867430µs}
     estimated metric savings: FCP 0 ms, LCP 150 ms
     estimated wasted bytes: 971.5 kB
     example question: What caching strategies can I apply to improve my page performance?
   - insight name: ImageDelivery
     description: Reducing the download time of images can improve the perceived load time of the page and LCP. [Learn more about optimizing image size](https://developer.chrome.com/docs/performance/insights/image-delivery)
-    relevant trace bounds: {min: 59728701403, max: 59729395208}
+    relevant trace bounds: {min: 59728701403µs, max: 59729395208µs}
     estimated metric savings: FCP 0 ms, LCP 100 ms
     estimated wasted bytes: 2 MB
     example question: What should I do to improve and optimize the time taken to fetch and display images on the page?
     example question: Are all images on my site optimized?
   - insight name: LCPBreakdown
     description: Each [subpart has specific improvement strategies](https://developer.chrome.com/docs/performance/insights/lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays.
-    relevant trace bounds: {min: 59728649746, max: 59729312744}
+    relevant trace bounds: {min: 59728649746µs, max: 59729312744µs}
     example question: Help me optimize my LCP score
     example question: Which LCP phase was most problematic?
     example question: What can I do to reduce the LCP time for this page load?
   - insight name: LCPDiscovery
     description: [Optimize LCP](https://developer.chrome.com/docs/performance/insights/lcp-discovery) by making the LCP image discoverable from the HTML immediately, and avoiding lazy-loading
-    relevant trace bounds: {min: 59728656735, max: 59729209036}
+    relevant trace bounds: {min: 59728656735µs, max: 59729209036µs}
     example question: Suggest fixes to reduce my LCP
     example question: What can I do to reduce my LCP discovery time?
     example question: Why is LCP discovery time important?
   - insight name: CLSCulprits
     description: Layout shifts occur when elements move absent any user interaction. [Investigate the causes of layout shifts](https://developer.chrome.com/docs/performance/insights/cls-culprit), such as elements being added, removed, or their fonts changing as the page loads.
-    relevant trace bounds: {min: 59729100192, max: 59730317334}
+    relevant trace bounds: {min: 59729100192µs, max: 59730317334µs}
     example question: Help me optimize my CLS score
     example question: How can I prevent layout shifts on this page?
   - insight name: DocumentLatency
     description: Your first network request is the most important. [Reduce its latency](https://developer.chrome.com/docs/performance/insights/document-latency) by avoiding redirects, ensuring a fast server response, and enabling text compression.
-    relevant trace bounds: {min: 59728651057, max: 59728790724}
+    relevant trace bounds: {min: 59728651057µs, max: 59728790724µs}
     estimated metric savings: FCP 0 ms, LCP 0 ms
     estimated wasted bytes: 1.6 kB
     example question: How do I decrease the initial loading time of my page?
     example question: Did anything slow down the request for this document?
   - insight name: Viewport
     description: 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.
-    relevant trace bounds: {min: 59728649746, max: 59734400108}
+    relevant trace bounds: {min: 59728649746µs, max: 59734400108µs}
     estimated metric savings: INP 0 ms
     example question: How do I make sure my page is optimized for mobile viewing?
   - insight name: ThirdParties
     description: 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.
-    relevant trace bounds: {min: 59728701403, max: 59729465969}
+    relevant trace bounds: {min: 59728701403µs, max: 59729465969µs}
     example question: Which third parties are having the largest impact on my page performance?
   - insight name: CharacterSet
     description: A character encoding declaration is required. It can be done with a meta charset tag in the first 1024 bytes of the HTML or in the Content-Type HTTP response header. [Learn more about declaring the character encoding](https://developer.chrome.com/docs/insights/charset/).
-    relevant trace bounds: {min: 59728651057, max: 59728790724}
+    relevant trace bounds: {min: 59728651057µs, max: 59728790724µs}
     example question: How do I declare a character encoding for my page?
 === end content
 
 Title: PerformanceTraceFormatter formatTraceSummary includes INP insight when there is no navigation
 Content:
 URL: https://b2607f8b04800100000289cb1c0a82ba72253000000000000000001.proxy.googlers.com/long-interaction/index.html?x=35
-Trace bounds: {min: 337943614456, max: 337947260898}
+Trace bounds: {min: 337943614456µs, max: 337947260898µs}
 CPU throttling: none
 Network throttling: none
 
@@ -831,7 +831,7 @@ The following is a list of insight sets. An insight set covers a specific part o
 ## insight set id: NO_NAVIGATION
 
 URL: https://b2607f8b04800100000289cb1c0a82ba72253000000000000000001.proxy.googlers.com/long-interaction/index.html?x=35
-Bounds: {min: 337943614456, max: 337947260898}
+Bounds: {min: 337943614456µs, max: 337947260898µs}
 Metrics (lab / observed):
   - INP: 139 ms, event: (eventKey: s-3347, ts: 337944870984)
   - CLS: 0.00
@@ -839,13 +839,13 @@ Metrics (field / real users): n/a – no data for this page in CrUX
 Available insights:
   - insight name: INPBreakdown
     description: Start investigating [how to improve INP](https://developer.chrome.com/docs/performance/insights/inp-breakdown) by looking at the longest subpart.
-    relevant trace bounds: {min: 337944870984, max: 337945010222}
+    relevant trace bounds: {min: 337944870984µs, max: 337945010222µs}
     example question: Suggest fixes for my longest interaction
     example question: Why is a large INP score problematic?
     example question: What's the biggest contributor to my longest interaction?
   - insight name: ThirdParties
     description: 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.
-    relevant trace bounds: {min: 337944792445, max: 337944809570}
+    relevant trace bounds: {min: 337944792445µs, max: 337944809570µs}
     example question: Which third parties are having the largest impact on my page performance?
 === end content
 

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

@@ -52,7 +52,7 @@ export class PerformanceTraceFormatter {
   }
 
   serializeBounds(bounds: Trace.Types.Timing.TraceWindowMicro): string {
-    return `{min: ${bounds.min}, max: ${bounds.max}}`;
+    return `{min: ${bounds.min}µs, max: ${bounds.max}µs}`;
   }
 
   /**

package/front_end/models/live-metrics/LiveMetrics.ts

@@ -62,7 +62,29 @@ export class LiveMetrics extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
 
   private constructor() {
     super();
-    SDK.TargetManager.TargetManager.instance().observeTargets(this);
+    const targetManager = SDK.TargetManager.TargetManager.instance();
+    targetManager.observeTargets(this, {scoped: true});
+    // Listen for target info changes to detect prerender activation.
+    // Scoped observers don't receive events when a prerendered target becomes
+    // primary because setScopeTarget() isn't called during that transition.
+    targetManager.addEventListener(
+        SDK.TargetManager.Events.AVAILABLE_TARGETS_CHANGED, this.#onAvailableTargetsChanged, this);
+  }
+
+  #onAvailableTargetsChanged(): void {
+    const primaryTarget = SDK.TargetManager.TargetManager.instance().primaryPageTarget();
+    if (primaryTarget && primaryTarget !== this.#target) {
+      // Primary target changed (e.g., prerender activation). Switch to it.
+      void this.#switchToTarget(primaryTarget);
+    }
+  }
+
+  async #switchToTarget(newTarget: SDK.Target.Target): Promise<void> {
+    if (this.#target) {
+      await this.disable();
+    }
+    this.#target = newTarget;
+    await this.enable();
   }
 
   static instance(opts: {forceNew?: boolean} = {forceNew: false}): LiveMetrics {
@@ -371,29 +393,20 @@ export class LiveMetrics extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
     this.#sendStatusUpdate();
   }
 
-  async #getFrameForExecutionContextId(executionContextId: Protocol.Runtime.ExecutionContextId):
-      Promise<SDK.ResourceTreeModel.ResourceTreeFrame|null> {
+  #isPrimaryFrameExecutionContext(executionContextId: Protocol.Runtime.ExecutionContextId): boolean {
     if (!this.#target) {
-      return null;
+      return false;
     }
 
     const runtimeModel = this.#target.model(SDK.RuntimeModel.RuntimeModel);
-    if (!runtimeModel) {
-      return null;
-    }
-
-    const executionContext = runtimeModel.executionContext(executionContextId);
-    if (!executionContext) {
-      return null;
-    }
-
-    const frameId = executionContext.frameId;
-    if (!frameId) {
-      return null;
+    const executionContext = runtimeModel?.executionContext(executionContextId);
+    if (!executionContext?.frameId) {
+      return false;
     }
 
-    const frameManager = SDK.FrameManager.FrameManager.instance();
-    return await frameManager.getOrWaitForFrame(frameId);
+    const resourceTreeModel = this.#target.model(SDK.ResourceTreeModel.ResourceTreeModel);
+    const primaryFrameId = resourceTreeModel?.mainFrame?.id;
+    return Boolean(primaryFrameId && executionContext.frameId === primaryFrameId);
   }
 
   async #onBindingCalled(event: {data: Protocol.Runtime.BindingCalledEvent}): Promise<void> {
@@ -407,25 +420,17 @@ export class LiveMetrics extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
     await this.#mutex.run(async () => {
       const webVitalsEvent = JSON.parse(data.payload) as Spec.WebVitalsEvent;
 
-      // This ensures that `#lastResetContextId` will always be an execution context on the
-      // primary frame. If we receive events from this execution context then we automatically
-      // know that they are for the primary frame.
-      if (this.#lastResetContextId !== data.executionContextId) {
-        if (webVitalsEvent.name !== 'reset') {
-          return;
-        }
-
-        // We should avoid calling this function for every event.
-        // If an interaction triggers a pre-rendered navigation then the old primary frame could
-        // be removed before we reach this point, and then it will hang forever.
-        const frame = await this.#getFrameForExecutionContextId(data.executionContextId);
-        if (!frame?.isPrimaryFrame()) {
+      if (webVitalsEvent.name === 'reset') {
+        if (!this.#isPrimaryFrameExecutionContext(data.executionContextId)) {
           return;
         }
-
         this.#lastResetContextId = data.executionContextId;
       }
 
+      if (this.#lastResetContextId !== data.executionContextId) {
+        return;
+      }
+
       await this.#handleWebVitalsEvent(webVitalsEvent, data.executionContextId);
     });
   }
@@ -464,6 +469,7 @@ export class LiveMetrics extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
   }
 
   async targetAdded(target: SDK.Target.Target): Promise<void> {
+    // Scoped observers can also receive events for OOPIFs and workers.
     if (target !== SDK.TargetManager.TargetManager.instance().primaryPageTarget()) {
       return;
     }
@@ -472,20 +478,12 @@ export class LiveMetrics extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
   }
 
   async targetRemoved(target: SDK.Target.Target): Promise<void> {
+    // Scoped observers can also receive events for OOPIFs and workers.
     if (target !== this.#target) {
       return;
     }
     await this.disable();
     this.#target = undefined;
-
-    // If the user navigates to a page that was pre-rendered then the primary page target
-    // will be swapped and the old target will be removed. We should ensure live metrics
-    // remain enabled on the new primary page target.
-    const primaryPageTarget = SDK.TargetManager.TargetManager.instance().primaryPageTarget();
-    if (primaryPageTarget) {
-      this.#target = primaryPageTarget;
-      await this.enable();
-    }
   }
 
   async enable(): Promise<void> {
@@ -555,6 +553,10 @@ export class LiveMetrics extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
       return;
     }
 
+    // Reset to ensure clean state when re-enabling on a new target.
+    // See crbug.com/478832430.
+    this.#lastResetContextId = undefined;
+
     await this.#killAllLiveMetricContexts();
 
     const runtimeModel = this.#target.model(SDK.RuntimeModel.RuntimeModel);

package/front_end/models/trace/EntityMapper.ts

@@ -10,6 +10,8 @@ import * as Helpers from './helpers/helpers.js';
 import type {ParsedTrace} from './ModelImpl.js';
 import type * as Types from './types/types.js';
 
+const mapperCache = new WeakMap<ParsedTrace, EntityMapper>();
+
 export class EntityMapper {
   #parsedTrace: ParsedTrace;
   #entityMappings: Handlers.Helpers.EntityMappings;
@@ -30,6 +32,16 @@ export class EntityMapper {
     this.#thirdPartyEvents = this.#getThirdPartyEvents();
   }
 
+  static getOrCreate(parsedTrace: ParsedTrace): EntityMapper {
+    const cached = mapperCache.get(parsedTrace);
+    if (cached) {
+      return cached;
+    }
+    const instance = new EntityMapper(parsedTrace);
+    mapperCache.set(parsedTrace, instance);
+    return instance;
+  }
+
   #findFirstPartyEntity(): Handlers.Helpers.Entity|null {
     // As a starting point, we consider the first navigation as the 1P.
     const nav =