Chrome DevTools MCP

exports[`performance > performance_analyze_insight > returns the information on the insight 1`] = ` ## Insight Title: LCP breakdown ## Insight Summary: This insight is used to analyze the time spent that contributed to the final LCP time and identify which of the 4 phases (or 2 if there was no LCP resource) are contributing most to the delay in rendering the LCP element. ## 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 (eventKey: s-1314, ts: 122411037986). ## LCP resource network request: https://web-dev.imgix.net/image/kheDArv5csY6rvQUJDbWRscckLr1/4i7JstVZvgTFk9dxCe4a.svg eventKey: s-1314 Timings: - Queued at: 41 ms - Request sent at: 47 ms - Download complete at: 56 ms - Main thread processing completed at: 58 ms Durations: - Download time: 0.3 ms - Main thread processing time: 2 ms - Total duration: 17 ms Redirects: no redirects Status code: 200 MIME Type: image/svg+xml Protocol: unknown Priority: VeryHigh Render blocking: No From a service worker: No Initiators (root request to the request that directly loaded this one): none We can break this time down into the 4 phases that combine to make the LCP time: - Time to first byte: 8 ms (6.1% of total LCP time) - Resource load delay: 33 ms (25.7% of total LCP time) - Resource load duration: 15 ms (11.4% of total LCP time) - Element render delay: 73 ms (56.8% of total LCP time) ## Estimated savings: none ## External resources: - https://developer.chrome.com/docs/performance/insights/lcp-breakdown - https://web.dev/articles/lcp - https://web.dev/articles/optimize-lcp `; exports[`performance > performance_stop_trace > returns an error message if parsing the trace buffer fails 1`] = ` The performance trace has been stopped. There was an unexpected error parsing the trace: No buffer was provided. `; exports[`performance > performance_stop_trace > returns the high level summary of the performance trace 1`] = ` The performance trace has been stopped. ## Summary of Performance trace findings: URL: https://web.dev/ Bounds: {min: 122410994891, max: 122416385853} CPU throttling: none Network throttling: none Metrics (lab / observed): - LCP: 129 ms, event: (eventKey: r-6063, ts: 122411126100), nodeId: 7 - LCP breakdown: - TTFB: 8 ms, bounds: {min: 122410996889, max: 122411004828} - Load delay: 33 ms, bounds: {min: 122411004828, max: 122411037986} - Load duration: 15 ms, bounds: {min: 122411037986, max: 122411052690} - Render delay: 73 ms, bounds: {min: 122411052690, max: 122411126100} - CLS: 0.00 Metrics (field / real users): n/a – no data for this page in CrUX Available insights: - insight name: LCPBreakdown description: Each [subpart has specific improvement strategies](https://developer.chrome.com/docs/performance/insights/lcp-breakdown). Ideally, most of the LCP time should be spent on loading the resources, not within delays. relevant trace bounds: {min: 122410996889, max: 122411126100} example question: Help me optimize my LCP score example question: Which LCP phase was most problematic? example question: What can I do to reduce the LCP time for this page load? - insight name: LCPDiscovery description: [Optimize LCP](https://developer.chrome.com/docs/performance/insights/lcp-discovery) by making the LCP image discoverable from the HTML immediately, and avoiding lazy-loading relevant trace bounds: {min: 122411004828, max: 122411055039} example question: Suggest fixes to reduce my LCP example question: What can I do to reduce my LCP discovery time? example question: Why is LCP discovery time important? - insight name: RenderBlocking description: Requests are blocking the page's initial render, which may delay LCP. [Deferring or inlining](https://developer.chrome.com/docs/performance/insights/render-blocking) can move these network requests out of the critical path. relevant trace bounds: {min: 122411037528, max: 122411053852} example question: Show me the most impactful render blocking requests that I should focus on example question: How can I reduce the number of render blocking requests? - insight name: DocumentLatency description: Your first network request is the most important. [Reduce its latency](https://developer.chrome.com/docs/performance/insights/document-latency) by avoiding redirects, ensuring a fast server response, and enabling text compression. relevant trace bounds: {min: 122410998910, max: 122411043781} estimated metric savings: FCP 0 ms, LCP 0 ms estimated wasted bytes: 77.1 kB example question: How do I decrease the initial loading time of my page? example question: Did anything slow down the request for this document? - insight name: ThirdParties description: 3rd party code can significantly impact load performance. [Reduce and defer loading of 3rd party code](https://developer.chrome.com/docs/performance/insights/third-parties) to prioritize your page's content. relevant trace bounds: {min: 122411037881, max: 122416229595} example question: Which third parties are having the largest impact on my page performance? ## Details on call tree & network request formats: Information on performance traces may contain main thread activity represented as call frames and network requests. Each call frame is presented in the following format: '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. * urlIndex: Index referencing the "All URLs" list. Empty if no specific script URL is associated. * childRange: Specifies the direct children of this node using their IDs. If empty ('' or 'S' at the end), the node has no children. If a single number (e.g., '4'), the node has one child with that ID. If in the format 'firstId-lastId' (e.g., '4-5'), it indicates a consecutive range of child IDs from 'firstId' to 'lastId', inclusive. * S: _Optional_. The letter 'S' terminates the line if that call frame was selected by the user. Example Call Tree: 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;; Network requests are formatted like this: \`urlIndex;eventKey;queuedTime;requestSentTime;downloadCompleteTime;processingCompleteTime;totalDuration;downloadDuration;mainThreadProcessingDuration;statusCode;mimeType;priority;initialPriority;finalPriority;renderBlocking;protocol;fromServiceWorker;initiators;redirects:[[redirectUrlIndex|startTime|duration]];responseHeaders:[header1Value|header2Value|...]\` - \`urlIndex\`: Numerical index for the request's URL, referencing the "All URLs" list. - \`eventKey\`: String that uniquely identifies this request's trace event. Timings (all in milliseconds, relative to navigation start): - \`queuedTime\`: When the request was queued. - \`requestSentTime\`: When the request was sent. - \`downloadCompleteTime\`: When the download completed. - \`processingCompleteTime\`: When main thread processing finished. Durations (all in milliseconds): - \`totalDuration\`: Total time from the request being queued until its main thread processing completed. - \`downloadDuration\`: Time spent actively downloading the resource. - \`mainThreadProcessingDuration\`: Time spent on the main thread after the download completed. - \`statusCode\`: The HTTP status code of the response (e.g., 200, 404). - \`mimeType\`: The MIME type of the resource (e.g., "text/html", "application/javascript"). - \`priority\`: The final network request priority (e.g., "VeryHigh", "Low"). - \`initialPriority\`: The initial network request priority. - \`finalPriority\`: The final network request priority (redundant if \`priority\` is always final, but kept for clarity if \`initialPriority\` and \`priority\` differ). - \`renderBlocking\`: 't' if the request was render-blocking, 'f' otherwise. - \`protocol\`: The network protocol used (e.g., "h2", "http/1.1"). - \`fromServiceWorker\`: 't' if the request was served from a service worker, 'f' otherwise. - \`initiators\`: A list (separated by ,) of URL indices for the initiator chain of this request. Listed in order starting from the root request to the request that directly loaded this one. This represents the network dependencies necessary to load this request. If there is no initiator, this is empty. - \`redirects\`: A comma-separated list of redirects, enclosed in square brackets. Each redirect is formatted as \`[redirectUrlIndex|startTime|duration]\`, where: \`redirectUrlIndex\`: Numerical index for the redirect's URL. \`startTime\`: The start time of the redirect in milliseconds, relative to navigation start. \`duration\`: The duration of the redirect in milliseconds. - \`responseHeaders\`: A list (separated by '|') of values for specific, pre-defined response headers, enclosed in square brackets. The order of headers corresponds to an internal fixed list. If a header is not present, its value will be empty. `;