Page Metrics

Navigate to any URL in a headless browser and return Puppeteer page load metrics as JSON.

API Reference

GET /metrics

Loads the page and returns metrics from page.metrics().

Example Request

curl "https://your-worker.workers.dev/metrics?url=https://www.cloudflare.com"

Success Response

url string

The normalized URL that was measured

metrics object

Puppeteer metrics such as Nodes, LayoutCount, ScriptDuration, and JSHeapUsedSize

{
  "url": "https://www.cloudflare.com/",
  "metrics": {
    "Timestamp": 12345.678,
    "Documents": 1,
    "Nodes": 842,
    "LayoutCount": 12,
    "ScriptDuration": 0.234,
    "JSHeapUsedSize": 1048576
  }
}

Error Response

{
  "error": "Missing or invalid query parameter: url",
  "code": "INVALID_URL"
}

Error Codes

• 400 - Missing or invalid url parameter
• 502 - Navigation or metrics collection failed (METRICS_ERROR)

Use Cases

• Measure DOM complexity and script cost after full page load
• Compare client-side rendering overhead across sites
• Debug performance issues that only appear in a real browser
• Learn Puppeteer metrics collection on Workers

Limitations

• Requires Browser Rendering enabled on your Cloudflare account
• Local development needs npx wrangler dev --remote
• Metrics reflect one page load at a fixed 1280×800 viewport
• Navigation timeout may fail on heavy single-page applications

Deployment

curl "https://your-worker.workers.dev/metrics?url=https://www.cloudflare.com"

Local Development

cd apps/experiments/page-metrics
npm install
npm run dev

Test locally:

curl "http://localhost:8787/metrics?url=https://www.cloudflare.com"

Cloudflare Features Used

• Workers - Edge compute runtime
• Browser Rendering - Headless Chromium via @cloudflare/puppeteer
• Puppeteer page.metrics() - Page load and memory metrics