chrome-devtools-frontend 1.0.1519267 → 1.0.1520139

package/front_end/core/host/GdpClient.ts

@@ -68,6 +68,11 @@ export interface Profile {
   };
 }
 
+interface InitializeResult {
+  hasProfile: boolean;
+  isEligible: boolean;
+}
+
 // The `batchGet` awards endpoint returns badge names with an
 // obfuscated user ID (e.g., `profiles/12345/awards/badge-name`).
 // This function normalizes them to use `me` instead of the ID
@@ -114,9 +119,13 @@ export class GdpClient {
     return gdpClientInstance;
   }
 
-  async initialize(): Promise<void> {
-    void this.getProfile();
-    void this.checkEligibility();
+  async initialize(): Promise<InitializeResult> {
+    return await Promise.all([this.getProfile(), this.checkEligibility()]).then(([profile, eligibilityResponse]) => {
+      return {
+        hasProfile: Boolean(profile),
+        isEligible: eligibilityResponse?.createProfile === EligibilityStatus.ELIGIBLE
+      };
+    });
   }
 
   async getProfile(): Promise<Profile|null> {

package/front_end/core/sdk/NetworkManager.ts

@@ -597,6 +597,7 @@ export class NetworkDispatcher implements ProtocolProxyApi.NetworkDispatcher {
     networkRequest.mixedContentType = request.mixedContentType || Protocol.Security.MixedContentType.None;
     networkRequest.setReferrerPolicy(request.referrerPolicy);
     networkRequest.setIsSameSite(request.isSameSite || false);
+    networkRequest.setIsAdRelated(request.isAdRelated || false);
   }
 
   private updateNetworkRequestWithResponse(networkRequest: NetworkRequest, response: Protocol.Network.Response): void {

package/front_end/core/sdk/NetworkRequest.ts

@@ -320,6 +320,7 @@ export class NetworkRequest extends Common.ObjectWrapper.ObjectWrapper<EventType
   directSocketInfo?: DirectSocketInfo;
   readonly #directSocketChunks: DirectSocketChunk[] = [];
   #isIpProtectionUsed: boolean;
+  #isAdRelated: boolean;
 
   constructor(
       requestId: string,
@@ -342,6 +343,7 @@ export class NetworkRequest extends Common.ObjectWrapper.ObjectWrapper<EventType
     this.#initiator = initiator;
     this.#hasUserGesture = hasUserGesture;
     this.#isIpProtectionUsed = false;
+    this.#isAdRelated = false;
   }
 
   static create(
@@ -1850,6 +1852,14 @@ export class NetworkRequest extends Common.ObjectWrapper.ObjectWrapper<EventType
     return this.#isIpProtectionUsed;
   }
 
+  setIsAdRelated(isAdRelated: boolean): void {
+    this.#isAdRelated = isAdRelated;
+  }
+
+  isAdRelated(): boolean {
+    return this.#isAdRelated;
+  }
+
   getAssociatedData(key: string): object|null {
     return this.#associatedData.get(key) || null;
   }

package/front_end/entrypoints/main/MainImpl.ts

@@ -519,7 +519,12 @@ export class MainImpl {
 
     // Initialize `GDPClient` and `UserBadges` for Google Developer Program integration
     if (Host.GdpClient.isGdpProfilesAvailable()) {
-      void Host.GdpClient.GdpClient.instance().initialize();
+      void Host.GdpClient.GdpClient.instance().initialize().then(({hasProfile, isEligible}) => {
+        const contextString = hasProfile ? 'has-profile' :
+            isEligible                   ? 'no-profile-and-eligible' :
+                                           'no-profile-and-not-eligible';
+        void VisualLogging.logFunctionCall('gdp-client-initialize', contextString);
+      });
       void Badges.UserBadges.instance().initialize();
       Badges.UserBadges.instance().addEventListener(Badges.Events.BADGE_TRIGGERED, async ev => {
         loadedPanelCommonModule ??= await import('../../panels/common/common.js') as typeof PanelCommon;

package/front_end/entrypoints/main/main-meta.ts

@@ -188,9 +188,9 @@ const UIStrings = {
   browserLanguage: 'Browser UI language',
   /**
    * @description Label for a checkbox in the settings UI. Allows developers to opt-in/opt-out
-   * of syncing DevTools settings via Chrome Sync.
+   * of saving settings to their Google account.
    */
-  enableSync: 'Enable settings sync',
+  saveSettings: 'Save `DevTools` settings to your `Google` account',
   /**
    * @description Label for a checkbox in the settings UI. Allows developers to opt-in/opt-out
    * of receiving Google Developer Program (GDP) badges based on their activity in Chrome DevTools.
@@ -789,7 +789,7 @@ Common.Settings.registerSettingExtension({
   // This name must be kept in sync with DevToolsSettings::kSyncDevToolsPreferencesFrontendName.
   settingName: 'sync-preferences',
   settingType: Common.Settings.SettingType.BOOLEAN,
-  title: i18nLazyString(UIStrings.enableSync),
+  title: i18nLazyString(UIStrings.saveSettings),
   defaultValue: false,
   reloadRequired: true,
 });

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

@@ -136,13 +136,23 @@ When referring to a trace event that has a corresponding \`eventKey\`, annotate
 When asking the user to make a choice between multiple options, output a list of choices at the end of your text response. The format is \`SUGGESTIONS: ["suggestion1", "suggestion2", "suggestion3"]\`. This MUST start on a newline, and be a single line.
 `;
 
+const extraPreambleWhenFreshTrace = `Additional notes:
+
+When referring to an element for which you know the nodeId, annotate your output using markdown link syntax:
+- For example, if nodeId is 23: [LCP element](#node-23)
+- This link will reveal the element in the Elements panel
+- Never mention node or nodeId when referring to the element, and especially not in the link text.
+- When referring to the LCP, it's useful to also mention what the LCP element is via its nodeId. Use the markdown link syntax to do so.
+`;
+
 const callFrameDataFormatDescription = `Each call frame is presented in the following format:
 
-'id;name;duration;selfTime;urlIndex;childRange;[S]'
+'id;eventKey;name;duration;selfTime;urlIndex;childRange;[S]'
 
 Key definitions:
 
 * id: A unique numerical identifier for the call frame. Never mention this id in the output to the user.
+* eventKey: String that uniquely identifies this event in the flame chart.
 * name: A concise string describing the call frame (e.g., 'Evaluate Script', 'render', 'fetchData').
 * duration: The total execution time of the call frame, including its children.
 * selfTime: The time spent directly within the call frame, excluding its children's execution.
@@ -152,11 +162,11 @@ Key definitions:
 
 Example Call Tree:
 
-1;main;500;100;;
-2;update;200;50;;3
-3;animate;150;20;0;4-5;S
-4;calculatePosition;80;80;;
-5;applyStyles;50;50;;
+1;r-123;main;500;100;;
+2;r-124;update;200;50;;3
+3;p-49575-15428179-2834-374;animate;150;20;0;4-5;S
+4;p-49575-15428179-3505-1162;calculatePosition;80;80;;
+5;p-49575-15428179-5391-2767;applyStyles;50;50;;
 `;
 
 enum ScorePriority {
@@ -188,7 +198,7 @@ export class PerformanceTraceContext extends ConversationContext<AgentFocus> {
   }
 
   override getOrigin(): string {
-    const {min, max} = this.#focus.data.parsedTrace.data.Meta.traceBounds;
+    const {min, max} = this.#focus.parsedTrace.data.Meta.traceBounds;
     return `trace-${min}-${max}`;
   }
 
@@ -197,7 +207,7 @@ export class PerformanceTraceContext extends ConversationContext<AgentFocus> {
   }
 
   override getTitle(): string {
-    const focus = this.#focus.data;
+    const focus = this.#focus;
 
     let url = focus.insightSet?.url;
     if (!url) {
@@ -208,6 +218,9 @@ export class PerformanceTraceContext extends ConversationContext<AgentFocus> {
     if (focus.insight) {
       parts.push(focus.insight.title);
     }
+    if (focus.event) {
+      parts.push(Trace.Name.forEntry(focus.event));
+    }
     if (focus.callTree) {
       const node = focus.callTree.selectedNode ?? focus.callTree.rootNode;
       parts.push(Trace.Name.forEntry(node.event));
@@ -220,9 +233,9 @@ export class PerformanceTraceContext extends ConversationContext<AgentFocus> {
    * "Ask AI".
    */
   override async getSuggestions(): Promise<ConversationSuggestions|undefined> {
-    const data = this.#focus.data;
+    const focus = this.#focus;
 
-    if (data.callTree) {
+    if (focus.callTree) {
       return [
         {title: 'What\'s the purpose of this work?', jslogContext: 'performance-default'},
         {title: 'Where is time being spent?', jslogContext: 'performance-default'},
@@ -230,17 +243,17 @@ export class PerformanceTraceContext extends ConversationContext<AgentFocus> {
       ];
     }
 
-    if (data.insight) {
-      return new PerformanceInsightFormatter(this.#focus, data.insight).getSuggestions();
+    if (focus.insight) {
+      return new PerformanceInsightFormatter(focus, focus.insight).getSuggestions();
     }
 
     const suggestions: ConversationSuggestions =
         [{title: 'What performance issues exist with my page?', jslogContext: 'performance-default'}];
 
-    if (data.insightSet) {
-      const lcp = data.insightSet ? Trace.Insights.Common.getLCP(data.insightSet) : null;
-      const cls = data.insightSet ? Trace.Insights.Common.getCLS(data.insightSet) : null;
-      const inp = data.insightSet ? Trace.Insights.Common.getINP(data.insightSet) : null;
+    if (focus.insightSet) {
+      const lcp = focus.insightSet ? Trace.Insights.Common.getLCP(focus.insightSet) : null;
+      const cls = focus.insightSet ? Trace.Insights.Common.getCLS(focus.insightSet) : null;
+      const inp = focus.insightSet ? Trace.Insights.Common.getINP(focus.insightSet) : null;
 
       const ModelHandlers = Trace.Handlers.ModelHandlers;
       const GOOD = Trace.Handlers.ModelHandlers.PageLoadMetrics.ScoreClassification.GOOD;
@@ -257,9 +270,9 @@ export class PerformanceTraceContext extends ConversationContext<AgentFocus> {
 
       // Add up to 3 suggestions from the top failing insights.
       const top3FailingInsightSuggestions =
-          Object.values(data.insightSet.model)
+          Object.values(focus.insightSet.model)
               .filter(model => model.state !== 'pass')
-              .map(model => new PerformanceInsightFormatter(this.#focus, model).getSuggestions().at(-1))
+              .map(model => new PerformanceInsightFormatter(focus, model).getSuggestions().at(-1))
               .filter(suggestion => !!suggestion)
               .slice(0, 3);
       suggestions.push(...top3FailingInsightSuggestions);
@@ -278,6 +291,7 @@ const MAX_FUNCTION_RESULT_BYTE_LENGTH = 16384 * 4;
  */
 export class PerformanceAgent extends AiAgent<AgentFocus> {
   #formatter: PerformanceTraceFormatter|null = null;
+  #lastEventForEnhancedQuery: Trace.Types.Events.Event|undefined;
   #lastInsightForEnhancedQuery: Trace.Insights.Types.InsightModel|undefined;
   #hasShownAnalyzeTraceContext = false;
 
@@ -298,6 +312,10 @@ export class PerformanceAgent extends AiAgent<AgentFocus> {
     text: extraPreambleWhenNotExternal,
     metadata: {source: 'devtools', score: ScorePriority.CRITICAL}
   };
+  #freshTraceExtraPreambleFact: Host.AidaClient.RequestFact = {
+    text: extraPreambleWhenFreshTrace,
+    metadata: {source: 'devtools', score: ScorePriority.CRITICAL}
+  };
   #networkDataDescriptionFact: Host.AidaClient.RequestFact = {
     text: PerformanceTraceFormatter.networkDataFormatDescription,
     metadata: {source: 'devtools', score: ScorePriority.CRITICAL}
@@ -371,10 +389,6 @@ export class PerformanceAgent extends AiAgent<AgentFocus> {
    *   1. go to paulirish.com, record a trace
    *   2. say "What performance issues exist with my page?"
    *   3. then say "images"
-   *
-   * TODO(cjamcl): reduce the reliance on this by making sure all URL references
-   * (such as the insight formatters) add the "eventKey" as a suffix, just like all
-   * other events.
    */
   #parseForKnownUrls(response: string): string {
     const focus = this.context?.getItem();
@@ -403,8 +417,7 @@ export class PerformanceAgent extends AiAgent<AgentFocus> {
         return match;
       }
 
-      const request =
-          focus.data.parsedTrace.data.NetworkRequests.byTime.find(request => request.args.data.url === urlText);
+      const request = focus.parsedTrace.data.NetworkRequests.byTime.find(request => request.args.data.url === urlText);
       if (!request) {
         return match;
       }
@@ -451,13 +464,21 @@ export class PerformanceAgent extends AiAgent<AgentFocus> {
     const focus = context.getItem();
     const selected: string[] = [];
 
-    if (focus.data.callTree) {
+    if (focus.event) {
+      const includeEventInfo = focus.event !== this.#lastEventForEnhancedQuery;
+      this.#lastEventForEnhancedQuery = focus.event;
+      if (includeEventInfo) {
+        selected.push(`User selected an event ${this.#formatter?.serializeEvent(focus.event)}.\n\n`);
+      }
+    }
+
+    if (focus.callTree) {
       // If this is a followup chat about the same call tree, don't include the call tree serialization again.
       // We don't need to repeat it and we'd rather have more the context window space.
       let contextString = '';
-      if (!this.#callTreeContextSet.has(focus.data.callTree)) {
-        contextString = focus.data.callTree.serialize();
-        this.#callTreeContextSet.add(focus.data.callTree);
+      if (!this.#callTreeContextSet.has(focus.callTree)) {
+        contextString = focus.callTree.serialize();
+        this.#callTreeContextSet.add(focus.callTree);
       }
 
       if (contextString) {
@@ -465,17 +486,17 @@ export class PerformanceAgent extends AiAgent<AgentFocus> {
       }
     }
 
-    if (focus.data.insight) {
+    if (focus.insight) {
       // We only need to add Insight info to a prompt when the context changes. For example:
       // User clicks Insight A. We need to send info on Insight A with the prompt.
       // User asks follow up question. We do not need to resend Insight A with the prompt.
       // User clicks Insight B. We now need to send info on Insight B with the prompt.
       // User clicks Insight A. We should resend the Insight info with the prompt.
-      const includeInsightInfo = focus.data.insight !== this.#lastInsightForEnhancedQuery;
-      this.#lastInsightForEnhancedQuery = focus.data.insight;
+      const includeInsightInfo = focus.insight !== this.#lastInsightForEnhancedQuery;
+      this.#lastInsightForEnhancedQuery = focus.insight;
 
       if (includeInsightInfo) {
-        selected.push(`User selected the ${focus.data.insight.insightKey} insight.\n\n`);
+        selected.push(`User selected the ${focus.insight.insightKey} insight.\n\n`);
       }
     }
 
@@ -587,11 +608,16 @@ export class PerformanceAgent extends AiAgent<AgentFocus> {
       this.addFact(this.#notExternalExtraPreambleFact);
     }
 
+    const isFresh = Tracing.FreshRecording.Tracker.instance().recordingIsFresh(focus.parsedTrace);
+    if (isFresh) {
+      this.addFact(this.#freshTraceExtraPreambleFact);
+    }
+
     this.addFact(this.#callFrameDataDescriptionFact);
     this.addFact(this.#networkDataDescriptionFact);
 
     if (!this.#traceFacts.length) {
-      this.#formatter = new PerformanceTraceFormatter(focus);
+      this.#formatter = new PerformanceTraceFormatter(focus, PerformanceInsightFormatter.create);
       this.#createFactForTraceSummary();
       this.#createFactForCriticalRequests();
       this.#createFactForMainThreadBottomUpSummary();
@@ -623,7 +649,7 @@ export class PerformanceAgent extends AiAgent<AgentFocus> {
 
   #declareFunctions(context: PerformanceTraceContext): void {
     const focus = context.getItem();
-    const {parsedTrace, insightSet} = focus.data;
+    const {parsedTrace, insightSet} = focus;
 
     this.declareFunction<{insightName: string}, {details: string}>('getInsightDetails', {
       description:

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

@@ -116,11 +116,11 @@ export class PerformanceAnnotationsAgent extends AiAgent<AgentFocus> {
     }
 
     const focus = context.getItem();
-    if (!focus.data.callTree) {
+    if (!focus.callTree) {
       throw new Error('unexpected context');
     }
 
-    const callTree = focus.data.callTree;
+    const callTree = focus.callTree;
 
     yield {
       type: ResponseType.CONTEXT,
@@ -140,11 +140,11 @@ export class PerformanceAnnotationsAgent extends AiAgent<AgentFocus> {
     }
 
     const focus = context.getItem();
-    if (!focus.data.callTree) {
+    if (!focus.callTree) {
       throw new Error('unexpected context');
     }
 
-    const callTree = focus.data.callTree;
+    const callTree = focus.callTree;
     const contextString = callTree.serialize();
     return `${contextString}\n\n# User request\n\n${query}`;
   }

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

@@ -7,7 +7,7 @@ This insight is used to analyze the time spent that contributed to the final LCP
 
 ## Detailed analysis:
 The Largest Contentful Paint (LCP) time for this navigation was 240 ms.
-The LCP element (IMG) is an image fetched from `https://creativetouchrotherham.co.uk/images/creative-touch-home/creative_touch_rotherham_homehero/creative_touch_rotherham_homehero_700.webp`.
+The LCP element (IMG, nodeId: 23) is an image fetched from https://creativetouchrotherham.co.uk/images/creative-touch-home/creative_touch_rotherham_homehero/creative_touch_rotherham_homehero_700.webp (eventKey: s-1418).
 ## LCP resource network request: https://creativetouchrotherham.co.uk/images/creative-touch-home/creative_touch_rotherham_homehero/creative_touch_rotherham_homehero_700.webp
 eventKey: s-1418
 Timings:
@@ -68,7 +68,7 @@ This insight is used to analyze the time spent that contributed to the final LCP
 
 ## Detailed analysis:
 The Largest Contentful Paint (LCP) time for this navigation was 129 ms.
-The LCP element is an image fetched from `https://web-dev.imgix.net/image/kheDArv5csY6rvQUJDbWRscckLr1/4i7JstVZvgTFk9dxCe4a.svg`.
+The LCP element is an image fetched from https://web-dev.imgix.net/image/kheDArv5csY6rvQUJDbWRscckLr1/4i7JstVZvgTFk9dxCe4a.svg (eventKey: s-1314).
 ## LCP resource network request: https://web-dev.imgix.net/image/kheDArv5csY6rvQUJDbWRscckLr1/4i7JstVZvgTFk9dxCe4a.svg
 eventKey: s-1314
 Timings:
@@ -186,7 +186,7 @@ It is important that all of these checks pass to minimize the delay between the
 
 ## Detailed analysis:
 The Largest Contentful Paint (LCP) time for this navigation was 1,077 ms.
-The LCP element is an image fetched from `http://localhost:8787/lcp-discovery-delay/lcp-image.jpg`.
+The LCP element is an image fetched from http://localhost:8787/lcp-discovery-delay/lcp-image.jpg (eventKey: s-25281).
 ## LCP resource network request: http://localhost:8787/lcp-discovery-delay/lcp-image.jpg
 eventKey: s-25281
 Timings:
@@ -310,7 +310,7 @@ Layout shifts in this cluster:
 - Start time: 472 ms
 - Score: 0.0003
 - Potential root causes:
-  - A font that was loaded over the network (https://fonts.gstatic.com/s/specialgothicexpandedone/v2/IurO6Zxk74-YaYk1r3HOet4g75ENmBxUmOK61tA0Iu5QmJF_.woff2).
+  - A font that was loaded over the network: https://fonts.gstatic.com/s/specialgothicexpandedone/v2/IurO6Zxk74-YaYk1r3HOet4g75ENmBxUmOK61tA0Iu5QmJF_.woff2 (eventKey: s-1158).
 ### Layout shift 2:
 - Start time: 857 ms
 - Score: 0.0844
@@ -320,12 +320,12 @@ Layout shifts in this cluster:
 - Start time: 1,352 ms
 - Score: 0.0068
 - Potential root causes:
-  - An unsized image (IMG) (url: http://localhost:8000/unsized-image.png).
+  - An unsized image (IMG) (url: http://localhost:8000/unsized-image.png (eventKey: s-4487)).
 ### Layout shift 4:
 - Start time: 1,537 ms
 - Score: 0.3344
 - Potential root causes:
-  - An unsized image (IMG) (url: http://localhost:8000/unsized-image.png).
+  - An unsized image (IMG) (url: http://localhost:8000/unsized-image.png (eventKey: s-4487)).
 ### Layout shift 5:
 - Start time: 2,343 ms
 - Score: 0.3396
@@ -338,6 +338,104 @@ Layout shifts in this cluster:
 - https://web.dev/articles/optimize-cls
 === end content
 
+Title: PerformanceInsightFormatter CLS serializes correctly when there are no layout shifts
+Content:
+## Insight Title: Layout shift culprits
+
+## Insight Summary:
+Cumulative Layout Shifts (CLS) is a measure of the largest burst of layout shifts for every unexpected layout shift that occurs during the lifecycle of a page. This is a Core Web Vital and the thresholds for categorizing a score are:
+- Good: 0.1 or less
+- Needs improvement: more than 0.1 and less than or equal to 0.25
+- Bad: over 0.25
+
+## Detailed analysis:
+No layout shifts were found.
+
+## Estimated savings: none
+
+## External resources:
+- https://wdeb.dev/articles/cls
+- https://web.dev/articles/optimize-cls
+=== end content
+
+Title: PerformanceInsightFormatter CLS outputs information on non-composited animations
+Content:
+## Insight Title: Layout shift culprits
+
+## Insight Summary:
+Cumulative Layout Shifts (CLS) is a measure of the largest burst of layout shifts for every unexpected layout shift that occurs during the lifecycle of a page. This is a Core Web Vital and the thresholds for categorizing a score are:
+- Good: 0.1 or less
+- Needs improvement: more than 0.1 and less than or equal to 0.25
+- Bad: over 0.25
+
+## Detailed analysis:
+The worst layout shift cluster was the cluster that started at 60 ms and ended at 1,243 ms, with a duration of 1,183 ms.
+The score for this cluster is 0.0140.
+
+Layout shifts in this cluster:
+### Layout shift 1:
+- Start time: 60 ms
+- Score: 0.0012
+- No potential root causes identified
+### Layout shift 2:
+- Start time: 76 ms
+- Score: 0.0012
+- No potential root causes identified
+### Layout shift 3:
+- Start time: 93 ms
+- Score: 0.0012
+- No potential root causes identified
+### Layout shift 4:
+- Start time: 110 ms
+- Score: 0.0012
+- No potential root causes identified
+### Layout shift 5:
+- Start time: 126 ms
+- Score: 0.0012
+- No potential root causes identified
+### Layout shift 6:
+- Start time: 143 ms
+- Score: 0.0012
+- No potential root causes identified
+### Layout shift 7:
+- Start time: 160 ms
+- Score: 0.0012
+- No potential root causes identified
+### Layout shift 8:
+- Start time: 176 ms
+- Score: 0.0012
+- No potential root causes identified
+### Layout shift 9:
+- Start time: 193 ms
+- Score: 0.0012
+- No potential root causes identified
+### Layout shift 10:
+- Start time: 210 ms
+- Score: 0.0012
+- No potential root causes identified
+### Layout shift 11:
+- Start time: 226 ms
+- Score: 0.0012
+- No potential root causes identified
+### Layout shift 12:
+- Start time: 243 ms
+- Score: 0.0012
+- Potential root causes:
+  - A non-composited animation:
+- non-composited animation: `change-height`
+    Animation name: change-height
+    Unsupported CSS properties:
+    - height
+    Failure reasons:
+      - TARGET_HAS_INVALID_COMPOSITING_STATE, UNSUPPORTED_CSS_PROPERTY
+
+## Estimated savings: none
+
+## External resources:
+- https://wdeb.dev/articles/cls
+- https://web.dev/articles/optimize-cls
+=== end content
+
 Title: PerformanceInsightFormatter INP breakdown serializes the correct details
 Content:
 ## Insight Title: INP breakdown
@@ -589,16 +687,16 @@ Total legacy JavaScript: 8 files.
 
 Legacy JavaScript by file:
 
-- Script: https://s.yimg.com/aaq/benji/benji-2.2.99.js - Wasted bytes: 37204 bytes
+- Script: https://s.yimg.com/aaq/benji/benji-2.2.99.js (eventKey: s-3387) - Wasted bytes: 37204 bytes
 Matches:
 Line: 0, Column: 133, Name: Promise.allSettled
 
-- Script: https://s.yimg.com/aaq/c/25fa214.caas-news_web.min.js - Wasted bytes: 36084 bytes
+- Script: https://s.yimg.com/aaq/c/25fa214.caas-news_web.min.js (eventKey: s-3412) - Wasted bytes: 36084 bytes
 Matches:
 Line: 0, Column: 13310, Name: Array.from
 Line: 0, Column: 14623, Name: Object.assign
 
-- Script: https://s.yimg.com/du/ay/wnsrvbjmeprtfrnfx.js - Wasted bytes: 12850 bytes
+- Script: https://s.yimg.com/du/ay/wnsrvbjmeprtfrnfx.js (eventKey: s-6273) - Wasted bytes: 12850 bytes
 Matches:
 Line: 111, Column: 7829, Name: @babel/plugin-transform-spread
 Line: 111, Column: 1794, Name: Array.prototype.find
@@ -607,21 +705,21 @@ Line: 111, Column: 2748, Name: Object.values
 Line: 111, Column: 2473, Name: String.prototype.includes
 Line: 111, Column: 2627, Name: String.prototype.startsWith
 
-- Script: https://static.criteo.net/js/ld/publishertag.prebid.144.js - Wasted bytes: 10751 bytes
+- Script: https://static.criteo.net/js/ld/publishertag.prebid.144.js (eventKey: s-257378) - Wasted bytes: 10751 bytes
 Matches:
 Line: 1, Column: 74871, Name: Array.isArray
 Line: 1, Column: 75344, Name: Array.prototype.filter
 Line: 1, Column: 75013, Name: Array.prototype.indexOf
 
-- Script: https://s.yimg.com/oa/consent.js - Wasted bytes: 8157 bytes
+- Script: https://s.yimg.com/oa/consent.js (eventKey: s-3384) - Wasted bytes: 8157 bytes
 Matches:
 Line: 1, Column: 132267, Name: Array.prototype.includes
 
-- Script: https://pm-widget.taboola.com/yahooweb-network/pmk-20220605.1.js - Wasted bytes: 7625 bytes
+- Script: https://pm-widget.taboola.com/yahooweb-network/pmk-20220605.1.js (eventKey: s-52229) - Wasted bytes: 7625 bytes
 Matches:
 Line: 181, Column: 26, Name: Object.keys
 
-- Script: https://news.yahoo.com/ - Wasted bytes: 7141 bytes
+- Script: https://news.yahoo.com/ (eventKey: s-2116) - Wasted bytes: 7141 bytes
 Matches:
 Line: 0, Column: 8382, Name: @babel/plugin-transform-classes
 Line: 0, Column: 107712, Name: Array.prototype.filter
@@ -629,7 +727,7 @@ Line: 0, Column: 107393, Name: Array.prototype.forEach
 Line: 0, Column: 108005, Name: Array.prototype.map
 Line: 0, Column: 108358, Name: String.prototype.includes
 
-- Script: https://cdn.taboola.com/libtrc/yahooweb-network/loader.js - Wasted bytes: 7061 bytes
+- Script: https://cdn.taboola.com/libtrc/yahooweb-network/loader.js (eventKey: s-6352) - Wasted bytes: 7061 bytes
 Matches:
 Line: 0, Column: 390544, Name: Object.entries
 Line: 0, Column: 390688, Name: Object.values
@@ -669,12 +767,12 @@ This insight identifies font issues when a webpage uses custom fonts, for exampl
 ## Detailed analysis:
 The following font display issues were found:
 
- - Font name: jizaRExUiTo99u79D0KExcOPIDU.woff2, URL: https://fonts.gstatic.com/s/ptsans/v17/jizaRExUiTo99u79D0KExcOPIDU.woff2, Property 'font-display' set to: 'auto', Wasted time: 20 ms.
- - Font name: SlGVmQWMvZQIdix7AFxXkHNSbRYXags.woff2, URL: https://fonts.gstatic.com/s/droidsans/v18/SlGVmQWMvZQIdix7AFxXkHNSbRYXags.woff2, Property 'font-display' set to: 'auto', Wasted time: 15 ms.
- - Font name: jizfRExUiTo99u79B_mh0O6tLR8a8zI.woff2, URL: https://fonts.gstatic.com/s/ptsans/v17/jizfRExUiTo99u79B_mh0O6tLR8a8zI.woff2, Property 'font-display' set to: 'auto', Wasted time: 15 ms.
- - Font name: SlGWmQWMvZQIdix7AFxXmMh3eDs1ZyHKpWg.woff2, URL: https://fonts.gstatic.com/s/droidsans/v18/SlGWmQWMvZQIdix7AFxXmMh3eDs1ZyHKpWg.woff2, Property 'font-display' set to: 'auto', Wasted time: 15 ms.
- - Font name: EJRVQgYoZZY2vCFuvAFWzr-_dSb_.woff2, URL: https://fonts.gstatic.com/s/ptserif/v18/EJRVQgYoZZY2vCFuvAFWzr-_dSb_.woff2, Property 'font-display' set to: 'auto', Wasted time: 15 ms.
- - Font name: S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2, URL: https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2, Property 'font-display' set to: 'auto', Wasted time: 10 ms.
+ - Font name: jizaRExUiTo99u79D0KExcOPIDU.woff2, URL: https://fonts.gstatic.com/s/ptsans/v17/jizaRExUiTo99u79D0KExcOPIDU.woff2 (eventKey: s-5246), Property 'font-display' set to: 'auto', Wasted time: 20 ms.
+ - Font name: SlGVmQWMvZQIdix7AFxXkHNSbRYXags.woff2, URL: https://fonts.gstatic.com/s/droidsans/v18/SlGVmQWMvZQIdix7AFxXkHNSbRYXags.woff2 (eventKey: s-5232), Property 'font-display' set to: 'auto', Wasted time: 15 ms.
+ - Font name: jizfRExUiTo99u79B_mh0O6tLR8a8zI.woff2, URL: https://fonts.gstatic.com/s/ptsans/v17/jizfRExUiTo99u79B_mh0O6tLR8a8zI.woff2 (eventKey: s-5259), Property 'font-display' set to: 'auto', Wasted time: 15 ms.
+ - Font name: SlGWmQWMvZQIdix7AFxXmMh3eDs1ZyHKpWg.woff2, URL: https://fonts.gstatic.com/s/droidsans/v18/SlGWmQWMvZQIdix7AFxXmMh3eDs1ZyHKpWg.woff2 (eventKey: s-5269), Property 'font-display' set to: 'auto', Wasted time: 15 ms.
+ - Font name: EJRVQgYoZZY2vCFuvAFWzr-_dSb_.woff2, URL: https://fonts.gstatic.com/s/ptserif/v18/EJRVQgYoZZY2vCFuvAFWzr-_dSb_.woff2 (eventKey: s-5325), Property 'font-display' set to: 'auto', Wasted time: 15 ms.
+ - Font name: S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2, URL: https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2 (eventKey: s-5238), Property 'font-display' set to: 'auto', Wasted time: 10 ms.
 
 Consider setting [`font-display`](https://developer.chrome.com/blog/font-display) to `swap` or `optional` to ensure text is consistently visible. `swap` can be further optimized to mitigate layout shifts with [font metric overrides](https://developer.chrome.com/blog/font-fallbacks).
 
@@ -714,28 +812,28 @@ Total potential savings: 2 MB
 
 The following images could be optimized:
 
-### https://images.ctfassets.net/u275ja1nivmq/6T6z40ay5GFCUtwV7DONgh/0e23606ed1692d9721ab0f39a8d8a99e/yeti_cover.jpg
+### https://images.ctfassets.net/u275ja1nivmq/6T6z40ay5GFCUtwV7DONgh/0e23606ed1692d9721ab0f39a8d8a99e/yeti_cover.jpg (eventKey: s-1212)
 - Potential savings: 1.1 MB
 - Optimizations:
 Using a modern image format (WebP, AVIF) or increasing the image compression could improve this image's download size. (Est 1.1 MB)
 
-### https://raw.githubusercontent.com/GoogleChrome/lighthouse/refs/heads/main/cli/test/fixtures/dobetterweb/lighthouse-rotating.gif
+### https://raw.githubusercontent.com/GoogleChrome/lighthouse/refs/heads/main/cli/test/fixtures/dobetterweb/lighthouse-rotating.gif (eventKey: s-1216)
 - Potential savings: 682 kB
 - Optimizations:
 Using video formats instead of GIFs can improve the download size of animated content. (Est 682 kB)
 
-### https://onlinepngtools.com/images/examples-onlinepngtools/elephant-hd-quality.png
+### https://onlinepngtools.com/images/examples-onlinepngtools/elephant-hd-quality.png (eventKey: s-1228)
 - Potential savings: 176 kB
 - Optimizations:
 Using a modern image format (WebP, AVIF) or increasing the image compression could improve this image's download size. (Est 134.1 kB)
 This image file is larger than it needs to be (640x436) for its displayed dimensions (200x136). Use responsive images to reduce the image download size. (Est 162.9 kB)
 
-### https://images.ctfassets.net/u275ja1nivmq/6T6z40ay5GFCUtwV7DONgh/0e23606ed1692d9721ab0f39a8d8a99e/yeti_cover.jpg?fm=webp
+### https://images.ctfassets.net/u275ja1nivmq/6T6z40ay5GFCUtwV7DONgh/0e23606ed1692d9721ab0f39a8d8a99e/yeti_cover.jpg?fm=webp (eventKey: s-1224)
 - Potential savings: 49.8 kB
 - Optimizations:
 Increasing the image compression factor could improve this image's download size. (Est 49.8 kB)
 
-### https://raw.githubusercontent.com/GoogleChrome/lighthouse/refs/heads/main/cli/test/fixtures/byte-efficiency/lighthouse-2048x1356.webp
+### https://raw.githubusercontent.com/GoogleChrome/lighthouse/refs/heads/main/cli/test/fixtures/byte-efficiency/lighthouse-2048x1356.webp (eventKey: s-1226)
 - Potential savings: 41.4 kB
 - Optimizations:
 This image file is larger than it needs to be (2048x1356) for its displayed dimensions (200x132). Use responsive images to reduce the image download size. (Est 41.4 kB)
@@ -852,9 +950,9 @@ The network dependency tree checks found one or more problems.
 Max critical path latency is 5,015 ms
 
 The following is the critical request chain:
-- http://localhost:8787/lcp-iframes/index.html (5,006 ms) (longest chain)
-  - http://localhost:8787/lcp-iframes/app.js (5,015 ms) (longest chain)
-  - http://localhost:8787/lcp-iframes/app.css (5,010 ms)
+- http://localhost:8787/lcp-iframes/index.html (eventKey: s-7103) (5,006 ms) (longest chain)
+  - http://localhost:8787/lcp-iframes/app.js (eventKey: s-7225) (5,015 ms) (longest chain)
+  - http://localhost:8787/lcp-iframes/app.css (eventKey: s-7213) (5,010 ms)
 
 no origins were preconnected.
 
@@ -979,7 +1077,7 @@ This insight identifies static resources that are not cached effectively by the
 ## Detailed analysis:
 The following resources were associated with ineffficient cache policies:
 
-- https://chromedevtools.github.io/performance-stories/lcp-large-image/app.css
+- https://chromedevtools.github.io/performance-stories/lcp-large-image/app.css (eventKey: s-1106)
   - Cache Time to Live (TTL): 600 seconds
   - Wasted bytes: 0 B