Skip to content

Timeout issues when getting performance metrics #124

@umaar

Description

@umaar

Describe the bug
Struggling to get useful performance metrics e.g. core web vitals.

To Reproduce
Steps to reproduce the behavior: follow the chat log

Expected behavior
To get core web vitals details.

Chrome version: 140

Chat log

> give me the core web vitals stats

⏺ I'll try a different approach to get the Core Web Vitals metrics by taking a fresh trace:

⏺ chrome-devtools - new_page (MCP)(url: "https://cwv-guide.vercel.app/")
  ⎿  # new_page response
     ## Pages
     0: about:blank
     … +2 lines (ctrl+o to expand)

⏺ chrome-devtools - performance_start_trace (MCP)(reload: true, autoStop: true)
  ⎿  # performance_start_trace response
     The performance trace has been stopped.
     Here is a high level summary of the trace and the Insights that were found:
     … +2 lines (ctrl+o to expand)

⏺ Let me try using JavaScript to extract the Core Web Vitals data directly from the page:

⏺ chrome-devtools - evaluate_script (MCP)(function: "() => {\n  return new Promise((resolve) => {\n    // Check if web-vitals library is available\n    if (window.webVitals) {\n
                                           const metrics = {};\n      \n      window.webVitals.onCLS((metric) => { metrics.CLS = metric.value; });\n
                                         window.webVitals.onFID((metric) => { metrics.FID = metric.value; });\n      window.webVitals.onFCP((metric) => { metrics.FCP = metric.value;
                                          });\n      window.webVitals.onLCP((metric) => { metrics.LCP = metric.value; });\n      window.webVitals.onTTFB((metric) => { metrics.TTFB =
                                          metric.value; });\n      \n      setTimeout(() => resolve(metrics), 3000);\n    } else {\n      // Fallback to performance API\n      const
                                          navigation = performance.getEntriesByType('navigation')[0];\n      const paint = performance.getEntriesByType('paint');\n      \n
                                         resolve({\n        TTFB: navigation ? navigation.responseStart - navigation.requestStart : null,\n        FCP: paint.find(p => p.name ===
                                         'first-contentful-paint')?.startTime || null,\n        domContentLoaded: navigation ? navigation.domContentLoadedEventEnd -
                                         navigation.domContentLoadedEventStart : null,\n        loadComplete: navigation ? navigation.loadEventEnd - navigation.loadEventStart :
                                         null\n      });\n    }\n  });\n}")
  ⎿  Error: Runtime.evaluate timed out. Increase the 'protocolTimeout' setting in launch/connect calls for a higher timeout if needed.

⏺ Let me try a simpler approach to get performance metrics:

⏺ chrome-devtools - evaluate_script (MCP)(function: "() => {\n  const navigation = performance.getEntriesByType('navigation')[0];\n  const paint =
                                         performance.getEntriesByType('paint');\n  \n  return {\n    TTFB: navigation ? Math.round(navigation.responseStart -
                                         navigation.requestStart) : null,\n    FCP: paint.find(p => p.name === 'first-contentful-paint')?.startTime || null,\n    LCP: paint.find(p
                                         => p.name === 'largest-contentful-paint')?.startTime || null,\n    domContentLoaded: navigation ?
                                         Math.round(navigation.domContentLoadedEventEnd - navigation.requestStart) : null,\n    loadComplete: navigation ?
                                         Math.round(navigation.loadEventEnd - navigation.requestStart) : null,\n    totalResources: performance.getEntriesByType('resource').length\n
                                           };\n}")
  ⎿  Error: Runtime.evaluate timed out. Increase the 'protocolTimeout' setting in launch/connect calls for a higher timeout if needed.

⏺ The site appears to be causing timeouts due to its intentionally slow loading patterns. Based on the network analysis I performed earlier, here are the Core Web Vitals
  characteristics for https://cwv-guide.vercel.app/:

  Core Web Vitals Stats for https://cwv-guide.vercel.app/

  Status: Unable to measure precisely due to site timeouts

It looks like it's executing client side JS to get perf metrics, I would've thought those would be available through the performance tracing tool?

Metadata

Metadata

Assignees

Labels

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions