chrome-devtools-frontend 1.0.1636056 → 1.0.1640418

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

@@ -3,14 +3,15 @@
 // found in the LICENSE file.
 
 import * as Host from '../../../core/host/host.js';
+import type {UrlString} from '../../../core/platform/DevToolsPath.js';
 import * as Root from '../../../core/root/root.js';
 import type * as SDK from '../../../core/sdk/sdk.js';
 import type * as Protocol from '../../../generated/protocol.js';
-import * as Greendev from '../../greendev/greendev.js';
 import type * as LHModel from '../../lighthouse/lighthouse.js';
 import type * as TextUtils from '../../text_utils/text_utils.js';
 import type * as Trace from '../../trace/trace.js';
 import type * as Workspace from '../../workspace/workspace.js';
+import {areOriginsEquivalent, extractContextOrigin, isOpaqueOrigin} from '../AiOrigins.js';
 import {debugLog, isStructuredLogEnabled} from '../debug.js';
 
 const MAX_SUGGESTION_LENGTH = 200;
@@ -37,21 +38,6 @@ export const enum ErrorType {
   CROSS_ORIGIN = 'cross-origin'
 }
 
-/**
- * Returns true if the origin is considered opaque and should be blocked from
- * AI assistance to prevent potential data leakage.
- *
- * @see https://crbug.com/513732588
- */
-export function isOpaqueOrigin(origin: string): boolean {
-  /**
-   * Origins starting with 'about' (like about:blank or about:srcdoc) are
-   * considered opaque. 'about://' is the sentinel used by DevTools
-   * ParsedURL.securityOrigin() for these.
-   */
-  return origin === 'null' || origin === 'data:' || origin.startsWith('about') || origin.startsWith('detached');
-}
-
 export const enum MultimodalInputType {
   SCREENSHOT = 'screenshot',
   UPLOADED_IMAGE = 'uploaded-image',
@@ -198,10 +184,14 @@ export interface ConversationSuggestion {
 export type ConversationSuggestions = [ConversationSuggestion, ...ConversationSuggestion[]];
 
 export abstract class ConversationContext<T> {
-  abstract getOrigin(): string;
+  abstract getURL(): string;
   abstract getItem(): T;
   abstract getTitle(): string;
 
+  getOrigin(): string {
+    return extractContextOrigin(this.getURL());
+  }
+
   /**
    * Returns true if this data context (e.g., a DOM node or Network Request) is
    * allowed to be included in a conversation that is locked to the provided
@@ -215,17 +205,14 @@ export abstract class ConversationContext<T> {
    * If undefined, the conversation has not yet been locked to an origin.
    */
   isOriginAllowed(establishedOrigin: string|undefined): boolean {
-    const dataOrigin = this.getOrigin();
-    // Opaque origins are never allowed to be used as context.
-    if (isOpaqueOrigin(dataOrigin)) {
-      return false;
-    }
+    const origin = this.getOrigin();
     // If no origin is established yet, this context will be the one to lock the conversation.
+    // Opaque origins are never allowed to be used as context.
     if (!establishedOrigin) {
-      return true;
+      return !isOpaqueOrigin(origin);
     }
     // Only allow data that matches the origin the conversation is already locked to.
-    return dataOrigin === establishedOrigin;
+    return areOriginsEquivalent(origin, establishedOrigin);
   }
 
   /**
@@ -322,6 +309,13 @@ export interface SourceFileAiWidget {
   };
 }
 
+export interface SourceFilesListAiWidget {
+  name: 'SOURCE_FILES_LIST';
+  data: {
+    uiSourceCodes: Workspace.UISourceCode.UISourceCode[],
+  };
+}
+
 export interface LighthouseReportAiWidget {
   name: 'LIGHTHOUSE_REPORT';
   data: {
@@ -338,9 +332,28 @@ export interface TimelineEventSummaryAiWidget {
   };
 }
 
-export type AiWidget = ComputedStyleAiWidget|CoreVitalsAiWidget|StylePropertiesAiWidget|DomTreeAiWidget|
-    PerformanceTraceAiWidget|PerfInsightAiWidget|TimelineRangeSummaryAiWidget|BottomUpTreeAiWidget|SourceFileAiWidget|
-    LighthouseReportAiWidget|TimelineEventSummaryAiWidget;
+export interface NetworkRequestGeneralHeadersAiWidget {
+  name: 'NETWORK_REQUEST_GENERAL_HEADERS';
+  data: {
+    request: SDK.NetworkRequest.NetworkRequest,
+  };
+}
+
+// If the line and column are not provided, we assume the whole file was sent to the agent.s
+export interface SourceCodeAiWidget {
+  name: 'SOURCE_CODE';
+  data: {
+    url: UrlString,
+    code: string,
+    line?: number,
+    column?: number,
+  };
+}
+
+export type AiWidget =
+    ComputedStyleAiWidget|CoreVitalsAiWidget|StylePropertiesAiWidget|DomTreeAiWidget|PerformanceTraceAiWidget|
+    PerfInsightAiWidget|TimelineRangeSummaryAiWidget|BottomUpTreeAiWidget|SourceFileAiWidget|LighthouseReportAiWidget|
+    TimelineEventSummaryAiWidget|NetworkRequestGeneralHeadersAiWidget|SourceCodeAiWidget|SourceFilesListAiWidget;
 
 export type FunctionCallHandlerResult<Result> = {
   requiresApproval: true,
@@ -403,6 +416,13 @@ interface AidaFetchResult {
   rpcId?: Host.AidaClient.RpcGlobalId;
 }
 
+class CrossOriginError extends Error {
+  constructor() {
+    super('Cross-origin navigation detected');
+    this.name = 'CrossOriginError';
+  }
+}
+
 /**
  * AiAgent is a base class for implementing an interaction with AIDA
  * that involves one or more requests being sent to AIDA optionally
@@ -498,6 +518,14 @@ export abstract class AiAgent<T> {
     this.#facts.clear();
   }
 
+  /**
+   * Clears any subclass-specific caches. This is called when a run encounters
+   * an error (e.g., cross-origin navigation, abort, or execution error) to
+   * prevent unvalidated cached data from being replayed in subsequent runs.
+   */
+  clearCache(): void {
+  }
+
   popPendingMultimodalInput(): MultimodalInput|undefined {
     return undefined;
   }
@@ -682,11 +710,7 @@ export abstract class AiAgent<T> {
 
     yield* this.handleContextDetails(options.selected);
 
-    const breakpointAgentEnabled = Greendev.Prototypes.instance().isEnabled('breakpointDebuggerAgent');
-    const isBreakpointDebuggerAgent = this.constructor.name === 'BreakpointDebuggerAgent';
-    const finalMaxSteps = (isBreakpointDebuggerAgent && breakpointAgentEnabled) ? 1000 : MAX_STEPS;
-
-    for (let i = 0; i < finalMaxSteps; i++) {
+    for (let i = 0; i < MAX_STEPS; i++) {
       yield {
         type: ResponseType.QUERYING,
       };
@@ -801,6 +825,10 @@ export abstract class AiAgent<T> {
           };
           request = this.buildRequest(query, Host.AidaClient.Role.ROLE_UNSPECIFIED);
         } catch (err) {
+          if (err instanceof CrossOriginError) {
+            yield this.#createErrorResponse(ErrorType.CROSS_ORIGIN);
+            break;
+          }
           debugLog('Error handling function call', err);
           yield this.#createErrorResponse(ErrorType.UNKNOWN);
           break;
@@ -869,8 +897,19 @@ export abstract class AiAgent<T> {
       }
     }
 
+    const isOriginBlocked = (): boolean => {
+      const allowedOriginResult = this.#allowedOrigin?.();
+      return Boolean(allowedOriginResult && 'blocked' in allowedOriginResult);
+    };
+
     let result = await call.handler(args, options);
 
+    // Check 1: After first handler execution.
+    // Navigation could have occurred during the async handler execution.
+    if (isOriginBlocked()) {
+      throw new CrossOriginError();
+    }
+
     if ('requiresApproval' in result) {
       if (code) {
         yield {
@@ -916,10 +955,24 @@ export abstract class AiAgent<T> {
         };
       }
 
+      // Re-check allowed origin after the approval await to prevent a TOCTOU (Time-of-Check
+      // to Time-of-Use) race condition where the page might have navigated cross-origin
+      // while the user was confirming the action.
+      // Check 2: After waiting for user approval.
+      if (isOriginBlocked()) {
+        throw new CrossOriginError();
+      }
+
       result = await call.handler(args, {
         ...options,
         approved: true,
       });
+
+      // Check 3: After second handler execution (approved run).
+      // Navigation could have occurred during the async execution of the approved action.
+      if (isOriginBlocked()) {
+        throw new CrossOriginError();
+      }
     }
 
     if ('result' in result) {
@@ -995,6 +1048,7 @@ export abstract class AiAgent<T> {
 
   #createErrorResponse(error: ErrorType): ResponseData {
     this.#removeLastRunParts();
+    this.clearCache();
     if (error !== ErrorType.ABORT) {
       Host.userMetrics.actionTaken(Host.UserMetrics.Action.AiAssistanceError);
     }

package/front_end/models/ai_assistance/agents/ContextSelectionAgent.snapshot.txt

@@ -91,7 +91,7 @@ Content:
     },
     {
       "name": "performanceRecordAndReload",
-      "description": "Records a new performance trace. Use this to measure and debug performance metrics and Core Web Vitals like Largest Contentful Paint (LCP), Interaction to Next Paint (INP), and Cumulative Layout Shift (CLS).",
+      "description": "Records a new performance trace. Use this to measure, analyze, and debug page performance, general performance issues, performance metrics, and Core Web Vitals like Largest Contentful Paint (LCP), Interaction to Next Paint (INP), and Cumulative Layout Shift (CLS).",
       "parameters": {
         "type": 6,
         "description": "",
@@ -102,7 +102,7 @@ Content:
     },
     {
       "name": "runLighthouseAudits",
-      "description": "Records a Lighthouse audit on the current page. Use this to debug accessibility, SEO, and best practices. (For performance metrics like LCP, use performanceRecordAndReload instead).",
+      "description": "Records a Lighthouse audit on the current page. Use this to debug accessibility, SEO, and best practices. (For any performance-related questions or performance issues, do NOT use this; use performanceRecordAndReload instead).",
       "parameters": {
         "type": 6,
         "description": "",

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

@@ -12,6 +12,7 @@ import * as Logs from '../../logs/logs.js';
 import * as NetworkTimeCalculator from '../../network_time_calculator/network_time_calculator.js';
 import type * as Trace from '../../trace/trace.js';
 import * as Workspace from '../../workspace/workspace.js';
+import {isOpaqueOrigin} from '../AiOrigins.js';
 import {debugLog} from '../debug.js';
 
 import {AccessibilityContext} from './AccessibilityAgent.js';
@@ -20,7 +21,6 @@ import {
   AiAgent,
   type AllowedOriginResult,
   type ContextResponse,
-  isOpaqueOrigin,
   type RequestOptions,
 } from './AiAgent.js';
 import {FileContext} from './FileAgent.js';
@@ -35,19 +35,26 @@ const lockedString = i18n.i18n.lockedString;
  * chrome_preambles.gcl). Sync local changes with the server-side.
  */
 const preamble = `
-You are a Web Development Assistant integrated into Chrome DevTools. Your tone is educational, supportive, and technically precise.
-You aim to help developers of all levels, prioritizing teaching web concepts as the primary entry point for any solution.
+You are an advanced Web Development Assistant and AI routing agent integrated into Chrome DevTools. Your tone is educational, supportive, and technically precise. You aim to help developers of all levels, prioritizing teaching web concepts as the primary entry point for any solution.
+
+Your role is to understand the user's query, identify the appropriate specialized agent to handle it, and select the relevant context from the page to assist that agent.
+
+# Workflow
+1.  **Analyze**: Understand the user's intent and what they are trying to achieve.
+2.  **Classify**: Determine which specialized agent is best suited for the task (e.g., StylingAgent for CSS/styling issues, NetworkAgent for network requests, FileAgent for source files, PerformanceAgent for performance details, AccessibilityAgent for accessibility reports, or StorageAgent for storage issues).
+3.  **Gather Context**: Identify what information the specialized agent will need. Proactively use your tools to find and select this context (e.g., finding the relevant DOM node, network request, file, or performance trace). Always try to select a single specific context before answering the question.
+4.  **Delegate**: Once context is selected, hand over to the specialized agent. If you are unable to delegate or gather more information, provide a comprehensive guide on how to fix the issue using Chrome DevTools, explaining how and why, or suggest any panel/flow that may help.
 
 # Considerations
 * Determine what is the domain of the question - styling, network, sources, performance or other part of DevTools.
-* For questions about web performance metrics (e.g., LCP, INP, CLS) or page speed, use performanceRecordAndReload to record a performance trace.
-* Proactively try to gather additional data. If a select specific data can be selected, select one.
-* Always try select single specific context before answering the question.
+* For questions about performance (e.g., general performance issues, page speed, performance metrics like LCP, INP, CLS), use performanceRecordAndReload to record a performance trace.
+* Proactively try to gather additional data. If a specific piece of data can be selected, select it.
+* Always try to select a single specific context before answering the question.
 * Avoid making assumptions without sufficient evidence, and always seek further clarification if needed.
 * When presenting solutions, clearly distinguish between the primary cause and contributing factors.
 * Please answer only if you are sure about the answer. Otherwise, explain why you're not able to answer.
 * If you are unable to gather more information provide a comprehensive guide to how to fix the issue using Chrome DevTools and explain how and why.
-* You can suggest any panel or flow in Chrome DevTools that may help the user out
+* You can suggest any panel or flow in Chrome DevTools that may help the user out.
 
 # Formatting Guidelines
 * Use Markdown for all code snippets.
@@ -55,7 +62,7 @@ You aim to help developers of all levels, prioritizing teaching web concepts as
 * **CRITICAL**: 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** If a tool returns an empty list, immediately pivot to the next logical tool (e.g., from sources to network).
-* **CRITICAL** Always exhaust all possible way to find and select context from different domains.
+* **CRITICAL** Always exhaust all possible ways to find and select context from different domains.
 * **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** You are a debugging assistant in DevTools. 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.
@@ -221,6 +228,12 @@ export class ContextSelectionAgent extends AiAgent<never> {
           return {
             context: new RequestContext(request, calculator),
             description: 'User selected a network request',
+            widgets: [{
+              name: 'NETWORK_REQUEST_GENERAL_HEADERS',
+              data: {
+                request,
+              },
+            }],
           };
         }
 
@@ -255,6 +268,7 @@ export class ContextSelectionAgent extends AiAgent<never> {
         const origin = allowedOriginResult.origin;
 
         const files: Array<{file: string, id: number | undefined}> = [];
+        const uiSourceCodes: Workspace.UISourceCode.UISourceCode[] = [];
         for (const file of ContextSelectionAgent.getUISourceCodes()) {
           const fileUrl = file.url();
           const fileOrigin = Common.ParsedURL.ParsedURL.extractOrigin(fileUrl);
@@ -267,10 +281,17 @@ export class ContextSelectionAgent extends AiAgent<never> {
             file: file.fullDisplayName(),
             id: ContextSelectionAgent.uiSourceCodeId.get(file),
           });
+          uiSourceCodes.push(file);
         }
 
         return {
           result: files,
+          widgets: [{
+            name: 'SOURCE_FILES_LIST',
+            data: {
+              uiSourceCodes,
+            },
+          }],
         };
       },
     });
@@ -336,7 +357,7 @@ export class ContextSelectionAgent extends AiAgent<never> {
 
     this.declareFunction('performanceRecordAndReload', {
       description:
-          'Records a new performance trace. Use this to measure and debug performance metrics and Core Web Vitals like Largest Contentful Paint (LCP), Interaction to Next Paint (INP), and Cumulative Layout Shift (CLS).',
+          'Records a new performance trace. Use this to measure, analyze, and debug page performance, general performance issues, performance metrics, and Core Web Vitals like Largest Contentful Paint (LCP), Interaction to Next Paint (INP), and Cumulative Layout Shift (CLS).',
       parameters: {
         type: Host.AidaClient.ParametersTypes.OBJECT,
         description: '',
@@ -373,7 +394,7 @@ export class ContextSelectionAgent extends AiAgent<never> {
 
     this.declareFunction<{mode: LHSupportedRunMode}>('runLighthouseAudits', {
       description:
-          'Records a Lighthouse audit on the current page. Use this to debug accessibility, SEO, and best practices. (For performance metrics like LCP, use performanceRecordAndReload instead).',
+          'Records a Lighthouse audit on the current page. Use this to debug accessibility, SEO, and best practices. (For any performance-related questions or performance issues, do NOT use this; use performanceRecordAndReload instead).',
       parameters: {
         type: Host.AidaClient.ParametersTypes.OBJECT,
         description: '',

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

@@ -105,7 +105,7 @@ export class ConversationSummaryContext extends ConversationContext<string> {
     this.#conversation = conversation;
   }
 
-  getOrigin(): string {
+  override getURL(): string {
     return 'devtools://ai-assistance';
   }
 

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

@@ -83,8 +83,8 @@ export class FileContext extends ConversationContext<Workspace.UISourceCode.UISo
     this.#file = file;
   }
 
-  override getOrigin(): string {
-    return new URL(this.#file.url()).origin;
+  override getURL(): string {
+    return this.#file.url();
   }
 
   override getItem(): Workspace.UISourceCode.UISourceCode {

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

@@ -101,7 +101,7 @@ export class GreenDevContext extends ConversationContext<string> {
     this.#context = context;
   }
 
-  getOrigin(): string {
+  override getURL(): string {
     return 'devtools://ai-assistance';
   }
 
@@ -393,8 +393,6 @@ export class GreenDevAgent extends AiAgent<string> {
   override preamble = preamble;
 
   get clientFeature(): Host.AidaClient.ClientFeature {
-    // Reuse CHROME_NETWORK_AGENT similar to how we reuse CHROME_FILE_AGENT
-    // in BreakpointDebuggerAgent.ts.
     return Host.AidaClient.ClientFeature.CHROME_NETWORK_AGENT;
   }
 

package/front_end/models/ai_assistance/agents/NetworkAgent.snapshot.txt

@@ -20,6 +20,25 @@ Content:
         "title": "Request initiator chain",
         "text": "- URL: <redacted cross-origin initiator URL>\n\t- URL: https://www.example.com\n\t\t- URL: https://www.example.com/1\n\t\t- URL: https://www.example.com/2"
       }
+    ],
+    "widgets": [
+      {
+        "name": "NETWORK_REQUEST_GENERAL_HEADERS",
+        "data": {
+          "request": {
+            "statusCode": 200,
+            "statusText": "",
+            "requestMethod": "",
+            "requestTime": 0,
+            "protocol": "",
+            "mixedContentType": "none",
+            "connectionId": "0",
+            "connectionReused": false,
+            "hasNetworkData": false,
+            "localizedFailDescription": null
+          }
+        }
+      }
     ]
   },
   {

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

@@ -2,7 +2,6 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import * as Common from '../../../core/common/common.js';
 import * as Host from '../../../core/host/host.js';
 import * as i18n from '../../../core/i18n/i18n.js';
 import * as Root from '../../../core/root/root.js';
@@ -111,13 +110,13 @@ export class RequestContext extends ConversationContext<SDK.NetworkRequest.Netwo
   }
 
   /**
-   * Note: this is not the literal origin of the network request. This origin
+   * Note: this is not the literal origin of the network request. This URL
    * is used to determine when we should force the user to start a new AI
    * conversation when the context changes. We allow a single AI conversation to
    * inspect all network requests that were made for that given target URL.
    */
-  override getOrigin(): string {
-    return Common.ParsedURL.ParsedURL.extractOrigin(this.#request.documentURL);
+  override getURL(): string {
+    return this.#request.documentURL;
   }
 
   override getItem(): SDK.NetworkRequest.NetworkRequest {
@@ -162,6 +161,12 @@ export class NetworkAgent extends AiAgent<SDK.NetworkRequest.NetworkRequest> {
     yield {
       type: ResponseType.CONTEXT,
       details: await createContextDetailsForNetworkAgent(selectedNetworkRequest),
+      widgets: [{
+        name: 'NETWORK_REQUEST_GENERAL_HEADERS',
+        data: {
+          request: selectedNetworkRequest.getItem(),
+        },
+      }],
     };
   }
 

package/front_end/models/ai_assistance/agents/PerformanceAgent.snapshot.txt

@@ -6,7 +6,7 @@ Content:
     "details": [
       {
         "title": "Trace details",
-        "text": "Trace summary:\nURL: https://web.dev/\nTrace bounds: {min: 465455241690µs, max: 465460435979µs}\nCPU throttling: 1x\nNetwork throttling: No throttling\n\n# Available insight sets\n\nThe following is a list of insight sets. An insight set covers a specific part of the trace, split by navigations. The insights within each insight set are specific to that part of the trace. Be sure to consider the insight set id and bounds when calling functions. If no specific insight set or navigation is mentioned, assume the user is referring to the first one.\n\n## insight set id: NO_NAVIGATION\n\nURL: https://web.dev/\nBounds: {min: 465455241690µs, max: 465456489730µs}\nMetrics (lab / observed):\n  - CLS: 0.00\nMetrics (field / real users): n/a – no data for this page in CrUX\nAvailable insights:\n  - insight name: ThirdParties\n    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.\n    relevant trace bounds: {min: 465456492168µs, max: 465460052616µs}\n    example question: Which third parties are having the largest impact on my page performance?\n\n## insight set id: NAVIGATION_1\n\nURL: https://web.dev/\nBounds: {min: 465456489730µs, max: 465460435979µs}\nMetrics (lab / observed):\n  - LCP: 676 ms, event: (eventKey: r-21246, ts: 465457166052), nodeId: 1680\n  - LCP breakdown:\n    - TTFB: 553 ms, bounds: {min: 465456489730µs, max: 465457042737µs}\n    - Render delay: 123 ms, bounds: {min: 465457042737µs, max: 465457166052µs}\n  - CLS: 0.02, event: (eventKey: s-14250, ts: 465457121239)\nMetrics (field / real users): n/a – no data for this page in CrUX\nAvailable insights:\n  - insight name: RenderBlocking\n    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.\n    relevant trace bounds: {min: 465457046567µs, max: 465457086893µs}\n    estimated metric savings: FCP 118 ms, LCP 118 ms\n    example question: Show me the most impactful render-blocking requests that I should focus on\n    example question: How can I reduce the number of render-blocking requests?\n  - insight name: LCPBreakdown\n    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.\n    relevant trace bounds: {min: 465456489730µs, max: 465457166052µs}\n    example question: Help me optimize my LCP score\n    example question: Which LCP phase was most problematic?\n    example question: What can I do to reduce the LCP time for this page load?\n  - insight name: CLSCulprits\n    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.\n    relevant trace bounds: {min: 465457121239µs, max: 465459012394µs}\n    example question: Help me optimize my CLS score\n    example question: How can I prevent layout shifts on this page?\n  - insight name: NetworkDependencyTree\n    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.\n    relevant trace bounds: {min: 465456490723µs, max: 465458472724µs}\n    example question: How do I optimize my network dependency tree?\n  - insight name: DOMSize\n    description: 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).\n    relevant trace bounds: {min: 465458287196µs, max: 465458340745µs}\n    example question: How can I reduce the size of my DOM?\n  - insight name: ThirdParties\n    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.\n    relevant trace bounds: {min: 465456492168µs, max: 465460052616µs}\n    example question: Which third parties are having the largest impact on my page performance?\n  - insight name: ForcedReflow\n    description: 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.\n    relevant trace bounds: {min: 465456489730µs, max: 465460435979µs}\n    example question: How can I avoid forced reflows and layout thrashing?\n    example question: What is forced reflow and why is it problematic?\n  - insight name: Cache\n    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).\n    relevant trace bounds: {min: 465457179567µs, max: 465459110674µs}\n    estimated metric savings: FCP 0 ms, LCP 0 ms\n    estimated wasted bytes: 16 kB\n    example question: What caching strategies can I apply to improve my page performance?\n# Critical network requests\n\n## insight set id: NO_NAVIGATION\n\nnone\n\n## insight set id: NAVIGATION_1\n\n\nNetwork requests data:\n\n\n\nallUrls = [0: https://web.dev/, 1: https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmEU9fCxc4AMP6lbBP.woff2, 2: https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmEU9fBxc4AMP6lbBP.woff2, 3: https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmEU9fABc4AMP6lbBP.woff2, 4: https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmEU9fChc4AMP6lbBP.woff2, 5: https://fonts.gstatic.com/s/materialicons/v142/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2, 6: https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmEU9fBBc4AMP6lQ.woff2, 7: https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu4mxKKTU1Kg.woff2, 8: https://web.dev/_pwa/web/manifest.json, 9: https://fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap, 10: https://fonts.gstatic.com/s/googlesans/v59/4UasrENHsxJlGDuGo1OIlJfC6l_24rlCK1Yo_Iqcsih3SAyH6cAwhX9RPjIUvbQoi-E.woff2, 11: https://fonts.googleapis.com/css2?family=Material+Icons&family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=block, 12: https://www.gstatic.com/devrel-devsite/prod/vafe2e13ca17bb026e70df42a2ead1c8192750e86a12923a88eda839025dabf95/web/css/app.css, 13: https://web.dev/extras.css]\n\n0;s-7302;1 ms;2 ms;568 ms;569 ms;568 ms;15 ms;0.5 ms;200;text/html;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[content-security-policy: base-uri 'self'; object-src 'none'; script-src 'strict-dynamic' 'unsafe-inline' https: http: 'nonce-pLl1WHuNABXXiQLLmUesvDyvzBJZdE' 'unsafe-eval'; report-uri https://csp.withgoogle.com/csp/devsite/v2|content-encoding: gzip|x-content-type-options: nosniff|date: Mon, 29 Apr 2024 11:01:15 GMT|strict-transport-security: max-age=63072000; includeSubdomains; preload|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|pragma: no-cache|last-modified: Fri, 26 Apr 2024 16:43:17 GMT|server: Google Frontend|vary: Cookie, Accept-Encoding|x-frame-options: SAMEORIGIN|content-type: text/html; charset=utf-8|x-cloud-trace-context: <redacted>|cache-control: no-cache, must-revalidate|expires: 0]\n1;s-49309;1,395 ms;1,402 ms;1,415 ms;1,423 ms;28 ms;94 μs;9 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Wed, 24 Apr 2024 15:02:33 GMT|x-content-type-options: nosniff|age: 417214|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 11 May 2022 19:24:58 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Thu, 24 Apr 2025 15:02:33 GMT]\n2;s-46519;1,348 ms;1,355 ms;1,361 ms;1,423 ms;75 ms;73 μs;62 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Mon, 29 Apr 2024 03:50:51 GMT|x-content-type-options: nosniff|age: 25516|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 11 May 2022 19:24:41 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Tue, 29 Apr 2025 03:50:51 GMT]\n3;s-46196;1,331 ms;1,339 ms;1,355 ms;1,420 ms;89 ms;0.1 ms;65 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Fri, 26 Apr 2024 20:29:46 GMT|x-content-type-options: nosniff|age: 224781|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 11 May 2022 19:24:39 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Sat, 26 Apr 2025 20:29:46 GMT]\n4;s-45814;1,326 ms;1,331 ms;1,348 ms;1,419 ms;93 ms;77 μs;71 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Thu, 25 Apr 2024 13:27:47 GMT|x-content-type-options: nosniff|age: 336500|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 11 May 2022 19:24:56 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Fri, 25 Apr 2025 13:27:47 GMT]\n5;s-44751;1,286 ms;1,307 ms;1,343 ms;1,416 ms;130 ms;1 ms;73 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Fri, 26 Apr 2024 09:49:05 GMT|x-content-type-options: nosniff|age: 263222|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Mon, 08 Apr 2024 19:04:51 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Sat, 26 Apr 2025 09:49:05 GMT]\n6;s-44728;1,285 ms;1,307 ms;1,343 ms;1,406 ms;120 ms;1 ms;62 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Sun, 28 Apr 2024 21:44:44 GMT|x-content-type-options: nosniff|age: 47483|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 11 May 2022 19:24:53 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Mon, 28 Apr 2025 21:44:44 GMT]\n7;s-44701;1,284 ms;1,300 ms;1,339 ms;1,405 ms;120 ms;0.2 ms;65 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Thu, 25 Apr 2024 09:35:28 GMT|x-content-type-options: nosniff|age: 350439|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 11 May 2022 19:24:50 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Fri, 25 Apr 2025 09:35:28 GMT]\n8;s-43119;1,751 ms;1,751 ms;1,771 ms;1,771 ms;20 ms;27 μs;0.2 ms;200;application/json;Medium;Medium;Medium;f;unknown;t;0;[];[date: Sun, 28 Apr 2024 14:07:49 GMT|last-modified: Wed, 24 Apr 2024 11:02:59 GMT|server: Google Frontend|age: 75208|content-type: application/json|x-cloud-trace-context: <redacted>|cache-control: public, max-age=86400|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>]\n9;s-7695;557 ms;557 ms;597 ms;597 ms;40 ms;3 ms;0.6 ms;200;text/css;VeryHigh;VeryHigh;VeryHigh;t;unknown;t;0;[];[date: Mon, 29 Apr 2024 11:01:15 GMT|content-encoding: gzip|x-content-type-options: nosniff|strict-transport-security: max-age=31536000|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|x-xss-protection: 0|last-modified: Mon, 29 Apr 2024 10:51:49 GMT|server: ESF|cross-origin-opener-policy: <redacted>|x-frame-options: SAMEORIGIN|content-type: text/css; charset=utf-8|access-control-allow-origin: *|cache-control: private, max-age=86400, stale-while-revalidate=604800|timing-allow-origin: *|link: <https://fonts.gstatic.com>; rel=preconnect; crossorigin|expires: Mon, 29 Apr 2024 11:01:15 GMT]\n7;s-34909;770 ms;770 ms;771 ms;776 ms;6 ms;40 μs;5 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[x-google-security-signals: <redacted>|x-google-gfe-service-trace: <redacted>|content-security-policy-report-only: <redacted>|x-google-scs-row-timestamp: <redacted>|x-google-gfe-response-code-details-trace: <redacted>|cross-origin-resource-policy: <redacted>|x-google-scs-row-key: <redacted>|content-type: font/woff2|access-control-allow-origin: *|x-google-data-version: <redacted>|cache-control: public, max-age=31536000|x-google-gfe-backend-request-info: <redacted>|x-google-dos-service-trace: <redacted>|x-google-backends: <redacted>|date: Thu, 26 Oct 2023 10:46:00 GMT|x-content-type-options: nosniff|expires: Fri, 25 Oct 2024 10:46:00 GMT|x-google-gfe-version: <redacted>|x-google-netmon-label: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-google-service: <redacted>|x-xss-protection: 0|x-google-gfe-handshake-trace: <redacted>|x-google-shellfish-status: <redacted>|last-modified: Wed, 11 May 2022 19:24:50 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|x-google-gfe-request-trace: <redacted>|accept-ranges: bytes|timing-allow-origin: *|x-google-scs-repo: <redacted>]\n10;s-11121;602 ms;602 ms;603 ms;611 ms;9 ms;27 μs;8 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Thu, 25 Apr 2024 15:44:03 GMT|x-content-type-options: nosniff|age: 328319|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 24 Apr 2024 23:37:14 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Fri, 25 Apr 2025 15:44:03 GMT]\n11;s-7703;557 ms;557 ms;597 ms;597 ms;40 ms;90 μs;0.1 ms;200;text/css;VeryHigh;VeryHigh;VeryHigh;t;unknown;t;0;[];[date: Mon, 29 Apr 2024 11:01:15 GMT|content-encoding: gzip|x-content-type-options: nosniff|strict-transport-security: max-age=31536000|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|x-xss-protection: 0|last-modified: Mon, 29 Apr 2024 11:01:15 GMT|server: ESF|cross-origin-opener-policy: <redacted>|x-frame-options: SAMEORIGIN|content-type: text/css; charset=utf-8|access-control-allow-origin: *|cache-control: private, max-age=86400, stale-while-revalidate=604800|timing-allow-origin: *|link: <https://fonts.gstatic.com>; rel=preconnect; crossorigin|expires: Mon, 29 Apr 2024 11:01:15 GMT]\n5;s-11334;606 ms;606 ms;607 ms;615 ms;9 ms;30 μs;8 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;11;[];[date: Fri, 26 Apr 2024 09:49:05 GMT|x-content-type-options: nosniff|age: 263217|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Mon, 08 Apr 2024 19:04:51 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Sat, 26 Apr 2025 09:49:05 GMT]\n12;s-7722;557 ms;557 ms;562 ms;568 ms;11 ms;0.5 ms;6 ms;200;text/css;VeryHigh;VeryHigh;VeryHigh;t;unknown;t;0;[];[date: Mon, 29 Apr 2024 10:56:02 GMT|content-encoding: gzip|x-content-type-options: nosniff|age: 256|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Thu, 25 Apr 2024 19:58:26 GMT|server: sffe|cross-origin-opener-policy: <redacted>|vary: Accept-Encoding|report-to: {\"group\":\"devrel-devsite\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/devrel-devsite\"}]}|content-type: text/css|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|expires: Tue, 29 Apr 2025 10:56:02 GMT]\n13;s-7737;557 ms;557 ms;561 ms;561 ms;4 ms;0.4 ms;0.2 ms;200;text/css;VeryHigh;VeryHigh;VeryHigh;t;unknown;t;0;[];[content-security-policy: base-uri 'self'; object-src 'none'; script-src 'strict-dynamic' 'unsafe-inline' https: http: 'nonce-laTwEoovJjOKcMoBUjSFaYO6rrF8dU' 'unsafe-eval'; report-uri https://csp.withgoogle.com/csp/devsite/v2|content-encoding: gzip|x-content-type-options: nosniff|date: Mon, 29 Apr 2024 11:00:18 GMT|strict-transport-security: max-age=63072000; includeSubdomains; preload|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|pragma: no-cache|last-modified: Tue, 19 Mar 2024 18:37:07 GMT|server: Google Frontend|vary: Cookie, Accept-Encoding|x-frame-options: SAMEORIGIN|content-type: text/css|x-cloud-trace-context: <redacted>|cache-control: no-cache, must-revalidate|expires: 0]\n\n# Main thread bottom-up summary\n\nThis is the bottom-up summary for the entire trace. Only the top 10 activities (sorted by self time) are shown. An activity is all the aggregated time spent on the same type of work. For example, it can be all the time spent in a specific JavaScript function, or all the time spent in a specific browser rendering stage (like layout, v8 compile, parsing html). \"Self time\" represents the aggregated time spent directly in an activity, across all occurrences. \"Total time\" represents the aggregated time spent in an activity or any of its children.\n\n## insight set id: NO_NAVIGATION\n\n- self: 12 ms, total: 12 ms, source: Profiling overhead\n- self: 4 ms, total: 28 ms, source: Task\n- self: 3 ms, total: 4 ms, source: Recalculate style (url: https://www.gstatic.com/devrel-devsite/prod/vafe2e13ca17bb026e70df42a2ead1c8192750e86a12923a88eda839025dabf95/js/devsite_app_module.js, line: 98, column: 12)\n- self: 2 ms, total: 2 ms, source: Commit\n- self: 0.9 ms, total: 2 ms, source: Function call (url: https://www.gstatic.com/devrel-devsite/prod/vafe2e13ca17bb026e70df42a2ead1c8192750e86a12923a88eda839025dabf95/js/devsite_app_module.js, line: 102, column: 35)\n- self: 0.8 ms, total: 13 ms, source: Evaluate script\n- self: 0.7 ms, total: 3 ms, source: Event: pointerover\n- self: 0.1 ms, total: 1 ms, source: Xh (url: https://www.gstatic.com/devrel-devsite/prod/vafe2e13ca17bb026e70df42a2ead1c8192750e86a12923a88eda839025dabf95/js/devsite_app_module.js, line: 104, column: 61)\n\n## insight set id: NAVIGATION_1\n\n- self: 46 ms, total: 49 ms, source: Recalculate style\n- self: 37 ms, total: 211 ms, source: Task\n- self: 21 ms, total: 22 ms, source: Layout\n- self: 17 ms, total: 19 ms, source: Compile code\n- self: 7 ms, total: 7 ms, source: Cache script code\n- self: 6 ms, total: 26 ms, source: Function call (url: https://www.gstatic.com/devrel-devsite/prod/vafe2e13ca17bb026e70df42a2ead1c8192750e86a12923a88eda839025dabf95/js/devsite_app_module.js, line: 288, column: 146)\n- self: 5 ms, total: 5 ms, source: Parse stylesheet\n- self: 5 ms, total: 5 ms, source: Pre-paint\n- self: 5 ms, total: 5 ms, source: Commit\n- self: 5 ms, total: 10 ms, source: appendChild\n\n# 3rd party summary\n\n## insight set id: NO_NAVIGATION\n\n- name: Google CDN, main thread time: 1 ms, network transfer size: 0 B\n\n## insight set id: NAVIGATION_1\n\n- name: Google CDN, main thread time: 38 ms, network transfer size: 2.1 MB\n- name: web.dev, main thread time: 3 ms, network transfer size: 432.1 kB\n- name: Google Analytics, main thread time: 0.6 ms, network transfer size: 52.9 kB\n- name: Google Fonts, main thread time: 0 ms, network transfer size: 411.9 kB\n\n# Longest tasks\n\n## insight set id: NO_NAVIGATION\n\n- total time: 13 ms, event: (eventKey: r-96, ts: 465455241964)\n- total time: 2 ms, event: (eventKey: r-934, ts: 465455475572)\n- total time: 1 ms, event: (eventKey: r-2310, ts: 465455879141)\n\n## insight set id: NAVIGATION_1\n\n- total time: 18 ms, event: (eventKey: r-20182, ts: 465457150438)\n- total time: 14 ms, event: (eventKey: r-12184, ts: 465457104625)\n- total time: 12 ms, event: (eventKey: r-10779, ts: 465457087373)\n\nUser selected the following call tree:\n\n\n\n# Call tree:\n\n1;r-10779;Task;3;;;2;;\n2;r-11902;Layout;3;3;;;;;S\n\n\n# User query\n\ntest"
+        "text": "Trace summary:\nURL: https://web.dev/\nTrace bounds: {min: 465455241690µs, max: 465460435979µs}\nCPU throttling: 1x\nNetwork throttling: No throttling\n\n# Available insight sets\n\nThe following is a list of insight sets. An insight set covers a specific part of the trace, split by navigations. The insights within each insight set are specific to that part of the trace. Be sure to consider the insight set id and bounds when calling functions. If no specific insight set or navigation is mentioned, assume the user is referring to the first one.\n\n## insight set id: NO_NAVIGATION\n\nURL: https://web.dev/\nBounds: {min: 465455241690µs, max: 465456489730µs}\nMetrics (lab / observed):\n  - CLS: 0.00\nMetrics (field / real users): n/a – no data for this page in CrUX\nAvailable insights:\n  - insight name: ThirdParties\n    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.\n    relevant trace bounds: {min: 465456492168µs, max: 465460052616µs}\n    example question: Which third parties are having the largest impact on my page performance?\n\n## insight set id: NAVIGATION_1\n\nURL: https://web.dev/\nBounds: {min: 465456489730µs, max: 465460435979µs}\nMetrics (lab / observed):\n  - LCP: 676 ms, event: (eventKey: r-21246, ts: 465457166052), nodeId: 1680\n  - LCP breakdown:\n    - TTFB: 553 ms, bounds: {min: 465456489730µs, max: 465457042737µs}\n    - Render delay: 123 ms, bounds: {min: 465457042737µs, max: 465457166052µs}\n  - CLS: 0.02, event: (eventKey: s-14250, ts: 465457121239)\nMetrics (field / real users): n/a – no data for this page in CrUX\nAvailable insights:\n  - insight name: RenderBlocking\n    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.\n    relevant trace bounds: {min: 465457046567µs, max: 465457086893µs}\n    estimated metric savings: FCP 118 ms, LCP 118 ms\n    example question: Show me the most impactful render-blocking requests that I should focus on\n    example question: How can I reduce the number of render-blocking requests?\n  - insight name: LCPBreakdown\n    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.\n    relevant trace bounds: {min: 465456489730µs, max: 465457166052µs}\n    example question: Help me optimize my LCP score\n    example question: Which LCP phase was most problematic?\n    example question: What can I do to reduce the LCP time for this page load?\n  - insight name: CLSCulprits\n    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.\n    relevant trace bounds: {min: 465457121239µs, max: 465459012394µs}\n    example question: Help me optimize my CLS score\n    example question: How can I prevent layout shifts on this page?\n  - insight name: NetworkDependencyTree\n    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.\n    relevant trace bounds: {min: 465456490723µs, max: 465458472724µs}\n    example question: How do I optimize my network dependency tree?\n  - insight name: DOMSize\n    description: 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).\n    relevant trace bounds: {min: 465458287196µs, max: 465458340745µs}\n    example question: How can I reduce the size of my DOM?\n  - insight name: ThirdParties\n    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.\n    relevant trace bounds: {min: 465456492168µs, max: 465460052616µs}\n    example question: Which third parties are having the largest impact on my page performance?\n  - insight name: ForcedReflow\n    description: 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.\n    relevant trace bounds: {min: 465456489730µs, max: 465460435979µs}\n    example question: How can I avoid forced reflows and layout thrashing?\n    example question: What is forced reflow and why is it problematic?\n  - insight name: Cache\n    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).\n    relevant trace bounds: {min: 465457179567µs, max: 465459110674µs}\n    estimated metric savings: FCP 0 ms, LCP 0 ms\n    estimated wasted bytes: 16 kB\n    example question: What caching strategies can I apply to improve my page performance?\n# Critical network requests\n\n## insight set id: NO_NAVIGATION\n\nnone\n\n## insight set id: NAVIGATION_1\n\n\nNetwork requests data:\n\n\n\nallUrls = [0: https://web.dev/, 1: https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmEU9fCxc4AMP6lbBP.woff2, 2: https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmEU9fBxc4AMP6lbBP.woff2, 3: https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmEU9fABc4AMP6lbBP.woff2, 4: https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmEU9fChc4AMP6lbBP.woff2, 5: https://fonts.gstatic.com/s/materialicons/v142/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2, 6: https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmEU9fBBc4AMP6lQ.woff2, 7: https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu4mxKKTU1Kg.woff2, 8: https://web.dev/_pwa/web/manifest.json, 9: https://fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap, 10: https://fonts.gstatic.com/s/googlesans/v59/4UasrENHsxJlGDuGo1OIlJfC6l_24rlCK1Yo_Iqcsih3SAyH6cAwhX9RPjIUvbQoi-E.woff2, 11: https://fonts.googleapis.com/css2?family=Material+Icons&family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=block, 12: https://www.gstatic.com/devrel-devsite/prod/vafe2e13ca17bb026e70df42a2ead1c8192750e86a12923a88eda839025dabf95/web/css/app.css, 13: https://web.dev/extras.css]\n\n0;s-7302;1 ms;2 ms;568 ms;569 ms;568 ms;15 ms;0.5 ms;200;text/html;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[content-security-policy: base-uri 'self'; object-src 'none'; script-src 'strict-dynamic' 'unsafe-inline' https: http: 'nonce-pLl1WHuNABXXiQLLmUesvDyvzBJZdE' 'unsafe-eval'; report-uri https://csp.withgoogle.com/csp/devsite/v2|content-encoding: gzip|x-content-type-options: nosniff|date: Mon, 29 Apr 2024 11:01:15 GMT|strict-transport-security: max-age=63072000; includeSubdomains; preload|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|pragma: no-cache|last-modified: Fri, 26 Apr 2024 16:43:17 GMT|server: Google Frontend|vary: Cookie, Accept-Encoding|x-frame-options: SAMEORIGIN|content-type: text/html; charset=utf-8|x-cloud-trace-context: <redacted>|cache-control: no-cache, must-revalidate|expires: 0]\n1;s-49309;1,395 ms;1,402 ms;1,415 ms;1,423 ms;28 ms;94 μs;9 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Wed, 24 Apr 2024 15:02:33 GMT|x-content-type-options: nosniff|age: 417214|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 11 May 2022 19:24:58 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Thu, 24 Apr 2025 15:02:33 GMT]\n2;s-46519;1,348 ms;1,355 ms;1,361 ms;1,423 ms;75 ms;73 μs;62 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Mon, 29 Apr 2024 03:50:51 GMT|x-content-type-options: nosniff|age: 25516|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 11 May 2022 19:24:41 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Tue, 29 Apr 2025 03:50:51 GMT]\n3;s-46196;1,331 ms;1,339 ms;1,355 ms;1,420 ms;89 ms;0.1 ms;65 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Fri, 26 Apr 2024 20:29:46 GMT|x-content-type-options: nosniff|age: 224781|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 11 May 2022 19:24:39 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Sat, 26 Apr 2025 20:29:46 GMT]\n4;s-45814;1,326 ms;1,331 ms;1,348 ms;1,419 ms;93 ms;77 μs;71 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Thu, 25 Apr 2024 13:27:47 GMT|x-content-type-options: nosniff|age: 336500|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 11 May 2022 19:24:56 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Fri, 25 Apr 2025 13:27:47 GMT]\n5;s-44751;1,286 ms;1,307 ms;1,343 ms;1,416 ms;130 ms;1 ms;73 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Fri, 26 Apr 2024 09:49:05 GMT|x-content-type-options: nosniff|age: 263222|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Mon, 08 Apr 2024 19:04:51 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Sat, 26 Apr 2025 09:49:05 GMT]\n6;s-44728;1,285 ms;1,307 ms;1,343 ms;1,406 ms;120 ms;1 ms;62 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Sun, 28 Apr 2024 21:44:44 GMT|x-content-type-options: nosniff|age: 47483|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 11 May 2022 19:24:53 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Mon, 28 Apr 2025 21:44:44 GMT]\n7;s-44701;1,284 ms;1,300 ms;1,339 ms;1,405 ms;120 ms;0.2 ms;65 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Thu, 25 Apr 2024 09:35:28 GMT|x-content-type-options: nosniff|age: 350439|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 11 May 2022 19:24:50 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Fri, 25 Apr 2025 09:35:28 GMT]\n8;s-43119;1,751 ms;1,751 ms;1,771 ms;1,771 ms;20 ms;27 μs;0.2 ms;200;application/json;Medium;Medium;Medium;f;unknown;t;0;[];[date: Sun, 28 Apr 2024 14:07:49 GMT|last-modified: Wed, 24 Apr 2024 11:02:59 GMT|server: Google Frontend|age: 75208|content-type: application/json|x-cloud-trace-context: <redacted>|cache-control: public, max-age=86400|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>]\n9;s-7695;557 ms;557 ms;597 ms;597 ms;40 ms;3 ms;0.6 ms;200;text/css;VeryHigh;VeryHigh;VeryHigh;t;unknown;t;0;[];[date: Mon, 29 Apr 2024 11:01:15 GMT|content-encoding: gzip|x-content-type-options: nosniff|strict-transport-security: max-age=31536000|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|x-xss-protection: 0|last-modified: Mon, 29 Apr 2024 10:51:49 GMT|server: ESF|cross-origin-opener-policy: <redacted>|x-frame-options: SAMEORIGIN|content-type: text/css; charset=utf-8|access-control-allow-origin: *|cache-control: private, max-age=86400, stale-while-revalidate=604800|timing-allow-origin: *|link: <https://fonts.gstatic.com>; rel=preconnect; crossorigin|expires: Mon, 29 Apr 2024 11:01:15 GMT]\n7;s-34909;770 ms;770 ms;771 ms;776 ms;6 ms;40 μs;5 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[x-google-security-signals: <redacted>|x-google-gfe-service-trace: <redacted>|content-security-policy-report-only: <redacted>|x-google-scs-row-timestamp: <redacted>|x-google-gfe-response-code-details-trace: <redacted>|cross-origin-resource-policy: <redacted>|x-google-scs-row-key: <redacted>|content-type: font/woff2|access-control-allow-origin: *|x-google-data-version: <redacted>|cache-control: public, max-age=31536000|x-google-gfe-backend-request-info: <redacted>|x-google-dos-service-trace: <redacted>|x-google-backends: <redacted>|date: Thu, 26 Oct 2023 10:46:00 GMT|x-content-type-options: nosniff|expires: Fri, 25 Oct 2024 10:46:00 GMT|x-google-gfe-version: <redacted>|x-google-netmon-label: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-google-service: <redacted>|x-xss-protection: 0|x-google-gfe-handshake-trace: <redacted>|x-google-shellfish-status: <redacted>|last-modified: Wed, 11 May 2022 19:24:50 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|x-google-gfe-request-trace: <redacted>|accept-ranges: bytes|timing-allow-origin: *|x-google-scs-repo: <redacted>]\n10;s-11121;602 ms;602 ms;603 ms;611 ms;9 ms;27 μs;8 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;;[];[date: Thu, 25 Apr 2024 15:44:03 GMT|x-content-type-options: nosniff|age: 328319|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Wed, 24 Apr 2024 23:37:14 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Fri, 25 Apr 2025 15:44:03 GMT]\n11;s-7703;557 ms;557 ms;597 ms;597 ms;40 ms;90 μs;0.1 ms;200;text/css;VeryHigh;VeryHigh;VeryHigh;t;unknown;t;0;[];[date: Mon, 29 Apr 2024 11:01:15 GMT|content-encoding: gzip|x-content-type-options: nosniff|strict-transport-security: max-age=31536000|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|x-xss-protection: 0|last-modified: Mon, 29 Apr 2024 11:01:15 GMT|server: ESF|cross-origin-opener-policy: <redacted>|x-frame-options: SAMEORIGIN|content-type: text/css; charset=utf-8|access-control-allow-origin: *|cache-control: private, max-age=86400, stale-while-revalidate=604800|timing-allow-origin: *|link: <https://fonts.gstatic.com>; rel=preconnect; crossorigin|expires: Mon, 29 Apr 2024 11:01:15 GMT]\n5;s-11334;606 ms;606 ms;607 ms;615 ms;9 ms;30 μs;8 ms;200;font/woff2;VeryHigh;VeryHigh;VeryHigh;f;unknown;t;11;[];[date: Fri, 26 Apr 2024 09:49:05 GMT|x-content-type-options: nosniff|age: 263217|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Mon, 08 Apr 2024 19:04:51 GMT|server: sffe|cross-origin-opener-policy: <redacted>|report-to: {\"group\":\"apps-themes\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/apps-themes\"}]}|content-type: font/woff2|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|timing-allow-origin: *|expires: Sat, 26 Apr 2025 09:49:05 GMT]\n12;s-7722;557 ms;557 ms;562 ms;568 ms;11 ms;0.5 ms;6 ms;200;text/css;VeryHigh;VeryHigh;VeryHigh;t;unknown;t;0;[];[date: Mon, 29 Apr 2024 10:56:02 GMT|content-encoding: gzip|x-content-type-options: nosniff|age: 256|content-security-policy-report-only: <redacted>|cross-origin-resource-policy: <redacted>|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|last-modified: Thu, 25 Apr 2024 19:58:26 GMT|server: sffe|cross-origin-opener-policy: <redacted>|vary: Accept-Encoding|report-to: {\"group\":\"devrel-devsite\",\"max_age\":2592000,\"endpoints\":[{\"url\":\"https://csp.withgoogle.com/csp/report-to/devrel-devsite\"}]}|content-type: text/css|access-control-allow-origin: *|cache-control: public, max-age=31536000|accept-ranges: bytes|expires: Tue, 29 Apr 2025 10:56:02 GMT]\n13;s-7737;557 ms;557 ms;561 ms;561 ms;4 ms;0.4 ms;0.2 ms;200;text/css;VeryHigh;VeryHigh;VeryHigh;t;unknown;t;0;[];[content-security-policy: base-uri 'self'; object-src 'none'; script-src 'strict-dynamic' 'unsafe-inline' https: http: 'nonce-laTwEoovJjOKcMoBUjSFaYO6rrF8dU' 'unsafe-eval'; report-uri https://csp.withgoogle.com/csp/devsite/v2|content-encoding: gzip|x-content-type-options: nosniff|date: Mon, 29 Apr 2024 11:00:18 GMT|strict-transport-security: max-age=63072000; includeSubdomains; preload|alt-svc: h3=\":443\"; ma=2592000,h3-29=\":443\"; ma=2592000|content-length: <redacted>|x-xss-protection: 0|pragma: no-cache|last-modified: Tue, 19 Mar 2024 18:37:07 GMT|server: Google Frontend|vary: Cookie, Accept-Encoding|x-frame-options: SAMEORIGIN|content-type: text/css|x-cloud-trace-context: <redacted>|cache-control: no-cache, must-revalidate|expires: 0]\n\n# Main thread bottom-up summary\n\nThis is the bottom-up summary for the entire trace. Only the top 10 activities (sorted by self time) are shown. An activity is all the aggregated time spent on the same type of work. For example, it can be all the time spent in a specific JavaScript function, or all the time spent in a specific browser rendering stage (like layout, v8 compile, parsing html). \"Self time\" represents the aggregated time spent directly in an activity, across all occurrences. \"Total time\" represents the aggregated time spent in an activity or any of its children.\n\n## insight set id: NO_NAVIGATION\n\n- self: 12 ms, total: 12 ms, source: Profiling overhead\n- self: 4 ms, total: 28 ms, source: Task\n- self: 3 ms, total: 4 ms, source: Recalculate style (url: https://www.gstatic.com/devrel-devsite/prod/vafe2e13ca17bb026e70df42a2ead1c8192750e86a12923a88eda839025dabf95/js/devsite_app_module.js, line: 98, column: 12)\n- self: 2 ms, total: 2 ms, source: Commit\n- self: 0.9 ms, total: 2 ms, source: Function call (url: https://www.gstatic.com/devrel-devsite/prod/vafe2e13ca17bb026e70df42a2ead1c8192750e86a12923a88eda839025dabf95/js/devsite_app_module.js, line: 102, column: 35)\n- self: 0.8 ms, total: 13 ms, source: Evaluate script\n- self: 0.7 ms, total: 3 ms, source: Event: pointerover\n- self: 0.1 ms, total: 1 ms, source: Xh (url: https://www.gstatic.com/devrel-devsite/prod/vafe2e13ca17bb026e70df42a2ead1c8192750e86a12923a88eda839025dabf95/js/devsite_app_module.js, line: 104, column: 61)\n\n## insight set id: NAVIGATION_1\n\n- self: 46 ms, total: 49 ms, source: Recalculate style\n- self: 37 ms, total: 211 ms, source: Task\n- self: 21 ms, total: 22 ms, source: Layout\n- self: 17 ms, total: 19 ms, source: Compile code\n- self: 7 ms, total: 7 ms, source: Cache script code\n- self: 6 ms, total: 26 ms, source: Function call (url: https://www.gstatic.com/devrel-devsite/prod/vafe2e13ca17bb026e70df42a2ead1c8192750e86a12923a88eda839025dabf95/js/devsite_app_module.js, line: 288, column: 146)\n- self: 5 ms, total: 5 ms, source: Parse stylesheet\n- self: 5 ms, total: 5 ms, source: Pre-paint\n- self: 5 ms, total: 5 ms, source: Commit\n- self: 5 ms, total: 10 ms, source: appendChild\n\n# 3rd party summary\n\n## insight set id: NO_NAVIGATION\n\n- name: Google CDN, main thread time: 1 ms, network transfer size: 0 B\n\n## insight set id: NAVIGATION_1\n\n- name: Google CDN, main thread time: 38 ms, network transfer size: 990 B\n- name: web.dev, main thread time: 3 ms, network transfer size: 84.3 kB\n- name: Google Analytics, main thread time: 0.6 ms, network transfer size: 52.9 kB\n- name: Google Fonts, main thread time: 0 ms, network transfer size: 42.2 kB\n\n# Longest tasks\n\n## insight set id: NO_NAVIGATION\n\n- total time: 13 ms, event: (eventKey: r-96, ts: 465455241964)\n- total time: 2 ms, event: (eventKey: r-934, ts: 465455475572)\n- total time: 1 ms, event: (eventKey: r-2310, ts: 465455879141)\n\n## insight set id: NAVIGATION_1\n\n- total time: 18 ms, event: (eventKey: r-20182, ts: 465457150438)\n- total time: 14 ms, event: (eventKey: r-12184, ts: 465457104625)\n- total time: 12 ms, event: (eventKey: r-10779, ts: 465457087373)\n\nUser selected the following call tree:\n\n\n\n# Call tree:\n\n1;r-10779;Task;3;;;2;;\n2;r-11902;Layout;3;3;;;;;S\n\n\n# User query\n\ntest"
       }
     ],
     "widgets": [
@@ -38,7 +38,7 @@ Content:
     "details": [
       {
         "title": "Trace details",
-        "text": "Trace summary:\nURL: https://chromedevtools.github.io/performance-stories/lcp-large-image/index.html\nTrace bounds: {min: 658799706428µs, max: 658804825864µs}\nCPU throttling: 1x\nNetwork throttling: No throttling\n\n# Available insight sets\n\nThe following is a list of insight sets. An insight set covers a specific part of the trace, split by navigations. The insights within each insight set are specific to that part of the trace. Be sure to consider the insight set id and bounds when calling functions. If no specific insight set or navigation is mentioned, assume the user is referring to the first one.\n\n## insight set id: NAVIGATION_0\n\nURL: https://chromedevtools.github.io/performance-stories/lcp-large-image/index.html\nBounds: {min: 658799738257µs, max: 658804825864µs}\nMetrics (lab / observed):\n  - LCP: 110 ms, event: (eventKey: r-2399, ts: 658799847880), nodeId: 10\n  - LCP breakdown:\n    - TTFB: 7 ms, bounds: {min: 658799738257µs, max: 658799745193µs}\n    - Load delay: 34 ms, bounds: {min: 658799745193µs, max: 658799778937µs}\n    - Load duration: 12 ms, bounds: {min: 658799778937µs, max: 658799791032µs}\n    - Render delay: 57 ms, bounds: {min: 658799791032µs, max: 658799847880µs}\n  - CLS: 0.00\nMetrics (field / real users): n/a – no data for this page in CrUX\nAvailable insights:\n  - insight name: LCPBreakdown\n    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.\n    relevant trace bounds: {min: 658799738257µs, max: 658799847880µs}\n    example question: Help me optimize my LCP score\n    example question: Which LCP phase was most problematic?\n    example question: What can I do to reduce the LCP time for this page load?\n  - insight name: LCPDiscovery\n    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\n    relevant trace bounds: {min: 658799745193µs, max: 658799793683µs}\n    example question: Suggest fixes to reduce my LCP\n    example question: What can I do to reduce my LCP discovery time?\n    example question: Why is LCP discovery time important?\n  - insight name: RenderBlocking\n    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.\n    relevant trace bounds: {min: 658799775876µs, max: 658799791419µs}\n    example question: Show me the most impactful render-blocking requests that I should focus on\n    example question: How can I reduce the number of render-blocking requests?\n  - insight name: ThirdParties\n    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.\n    relevant trace bounds: {min: 658799775876µs, max: 658799807449µs}\n    example question: Which third parties are having the largest impact on my page performance?\n  - insight name: Cache\n    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).\n    relevant trace bounds: {min: 658799777502µs, max: 658799791419µs}\n    example question: What caching strategies can I apply to improve my page performance?\n# Critical network requests\n\nnone\n\n# Main thread bottom-up summary\n\nThis is the bottom-up summary for the entire trace. Only the top 10 activities (sorted by self time) are shown. An activity is all the aggregated time spent on the same type of work. For example, it can be all the time spent in a specific JavaScript function, or all the time spent in a specific browser rendering stage (like layout, v8 compile, parsing html). \"Self time\" represents the aggregated time spent directly in an activity, across all occurrences. \"Total time\" represents the aggregated time spent in an activity or any of its children.\n\n- self: 57 ms, total: 79 ms, source: Task\n- self: 5 ms, total: 5 ms, source: Layout\n- self: 4 ms, total: 4 ms, source: Major GC\n- self: 3 ms, total: 3 ms, source: Parse HTML\n- self: 2 ms, total: 2 ms, source: Recalculate style\n- self: 2 ms, total: 2 ms, source: Commit\n- self: 1 ms, total: 1 ms, source: C++ GC\n- self: 1 ms, total: 1 ms, source: Paint\n\n# 3rd party summary\n\n- name: GitHub, main thread time: 3 ms, network transfer size: 690 B\n- name: Google Fonts, main thread time: 0 ms, network transfer size: 1.1 kB\n- name: placeholder.com, main thread time: 0 ms, network transfer size: 65.8 kB\n\n# Longest tasks\n\n- total time: 23 ms, event: (eventKey: r-617, ts: 658799757023)\n- total time: 12 ms, event: (eventKey: r-1571, ts: 658799793885)\n- total time: 11 ms, event: (eventKey: r-1891, ts: 658799811130)\n\nUser selected the LCPBreakdown insight.\n\n\n# User query\n\ntest"
+        "text": "Trace summary:\nURL: https://chromedevtools.github.io/performance-stories/lcp-large-image/index.html\nTrace bounds: {min: 658799706428µs, max: 658804825864µs}\nCPU throttling: 1x\nNetwork throttling: No throttling\n\n# Available insight sets\n\nThe following is a list of insight sets. An insight set covers a specific part of the trace, split by navigations. The insights within each insight set are specific to that part of the trace. Be sure to consider the insight set id and bounds when calling functions. If no specific insight set or navigation is mentioned, assume the user is referring to the first one.\n\n## insight set id: NAVIGATION_0\n\nURL: https://chromedevtools.github.io/performance-stories/lcp-large-image/index.html\nBounds: {min: 658799738257µs, max: 658804825864µs}\nMetrics (lab / observed):\n  - LCP: 110 ms, event: (eventKey: r-2399, ts: 658799847880), nodeId: 10\n  - LCP breakdown:\n    - TTFB: 7 ms, bounds: {min: 658799738257µs, max: 658799745193µs}\n    - Load delay: 34 ms, bounds: {min: 658799745193µs, max: 658799778937µs}\n    - Load duration: 12 ms, bounds: {min: 658799778937µs, max: 658799791032µs}\n    - Render delay: 57 ms, bounds: {min: 658799791032µs, max: 658799847880µs}\n  - CLS: 0.00\nMetrics (field / real users): n/a – no data for this page in CrUX\nAvailable insights:\n  - insight name: LCPBreakdown\n    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.\n    relevant trace bounds: {min: 658799738257µs, max: 658799847880µs}\n    example question: Help me optimize my LCP score\n    example question: Which LCP phase was most problematic?\n    example question: What can I do to reduce the LCP time for this page load?\n  - insight name: LCPDiscovery\n    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\n    relevant trace bounds: {min: 658799745193µs, max: 658799793683µs}\n    example question: Suggest fixes to reduce my LCP\n    example question: What can I do to reduce my LCP discovery time?\n    example question: Why is LCP discovery time important?\n  - insight name: RenderBlocking\n    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.\n    relevant trace bounds: {min: 658799775876µs, max: 658799791419µs}\n    example question: Show me the most impactful render-blocking requests that I should focus on\n    example question: How can I reduce the number of render-blocking requests?\n  - insight name: Cache\n    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).\n    relevant trace bounds: {min: 658799777502µs, max: 658799791419µs}\n    example question: What caching strategies can I apply to improve my page performance?\n# Critical network requests\n\nnone\n\n# Main thread bottom-up summary\n\nThis is the bottom-up summary for the entire trace. Only the top 10 activities (sorted by self time) are shown. An activity is all the aggregated time spent on the same type of work. For example, it can be all the time spent in a specific JavaScript function, or all the time spent in a specific browser rendering stage (like layout, v8 compile, parsing html). \"Self time\" represents the aggregated time spent directly in an activity, across all occurrences. \"Total time\" represents the aggregated time spent in an activity or any of its children.\n\n- self: 57 ms, total: 79 ms, source: Task\n- self: 5 ms, total: 5 ms, source: Layout\n- self: 4 ms, total: 4 ms, source: Major GC\n- self: 3 ms, total: 3 ms, source: Parse HTML\n- self: 2 ms, total: 2 ms, source: Recalculate style\n- self: 2 ms, total: 2 ms, source: Commit\n- self: 1 ms, total: 1 ms, source: C++ GC\n- self: 1 ms, total: 1 ms, source: Paint\n\n# 3rd party summary\n\n- name: GitHub, main thread time: 3 ms, network transfer size: 0 B\n\n# Longest tasks\n\n- total time: 23 ms, event: (eventKey: r-617, ts: 658799757023)\n- total time: 12 ms, event: (eventKey: r-1571, ts: 658799793885)\n- total time: 11 ms, event: (eventKey: r-1891, ts: 658799811130)\n\nUser selected the LCPBreakdown insight.\n\n\n# User query\n\ntest"
       }
     ],
     "widgets": [