Page Speed API: How to Monitor Core Web Vitals Automatically

Website speed is no longer just a vanity metric—it is a critical ranking factor for search engines and directly impacts your conversion rates. Google’s Core Web Vitals measure the user experience of a page, focusing on loading performance, interactivity, and visual stability.

But how do you track these metrics over time across hundreds or thousands of pages? Checking them manually via PageSpeed Insights or Lighthouse is not scalable.

The solution is to use a Page Speed API to monitor your website programmatically. In this guide, we will explore what metrics to track, why they matter, and how to automate Core Web Vitals monitoring for your projects.

What Are Core Web Vitals?

Core Web Vitals are a set of three specific web page experience metrics that Google considers crucial:

1. Largest Contentful Paint (LCP): Measures loading performance. To provide a good user experience, LCP should occur within 2.5 seconds of when the page first starts loading.
2. First Input Delay (FID) / Interaction to Next Paint (INP): Measures interactivity. Pages should have an INP of 200 milliseconds or less.
3. Cumulative Layout Shift (CLS): Measures visual stability. Pages should maintain a CLS of 0.1 or less.

Tracking these metrics ensures your users get a fast, stable experience and your website remains competitive in search rankings.

Why Automate Page Speed Monitoring?

Manually running Lighthouse tests every time you deploy new code is inefficient and prone to error. By automating performance monitoring with an API, you gain several advantages:

• Catch regressions early: Get notified immediately if a recent code deployment negatively impacts your load times.
• Track competitors: Monitor your competitors' website performance alongside your own.
• Scale across thousands of URLs: Easily audit large sites like e-commerce catalogs or news portals without manual work.
• Build custom dashboards: Integrate performance data directly into your internal tools or Grafana dashboards.

How to Build a Monitoring Tool

With ToolCenter's Page Speed API, fetching performance metrics is incredibly simple. You do not need to set up headless browsers or manage Lighthouse instances.

cURL Example

Here is how you can fetch Core Web Vitals for any URL using a single API request:

curl -X POST "https://api.toolcenter.dev/v1/page-speed" \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -d '{
    "url": "https://example.com",
    "strategy": "mobile"
  }'

Response Breakdown

The API returns a structured JSON payload containing the Core Web Vitals and actionable insights:

{
  "status": "success",
  "data": {
    "url": "https://example.com",
    "strategy": "mobile",
    "score": 92,
    "metrics": {
      "lcp": 1.2,
      "inp": 45,
      "cls": 0.01,
      "fcp": 0.8,
      "tti": 1.5
    },
    "passed_audits": 24,
    "failed_audits": 2,
    "warnings": []
  }
}

Creating an Automated Cron Job

To monitor your metrics continuously, you can create a simple cron job that fetches the data daily and alerts you if any metric drops below your established threshold.

Node.js Example

Using Node.js and the node-cron package, you can set up a monitoring script:

const cron = require('node-cron');
const axios = require('axios');

const API_KEY = 'YOUR_API_KEY';
const TARGET_URL = 'https://example.com';
const SLACK_WEBHOOK = 'https://hooks.slack.com/services/...';

// Run every day at 8:00 AM
cron.schedule('0 8 * * *', async () => {
  try {
    const response = await axios.post('https://api.toolcenter.dev/v1/page-speed', {
      url: TARGET_URL,
      strategy: 'mobile'
    }, {
      headers: {
        'Authorization': `Bearer ${API_KEY}`,
        'Content-Type': 'application/json'
      }
    });

    const metrics = response.data.data.metrics;
    
    // Alert if LCP is worse than 2.5 seconds
    if (metrics.lcp > 2.5) {
      await axios.post(SLACK_WEBHOOK, {
        text: `🚨 Performance Alert: LCP for ${TARGET_URL} has degraded to ${metrics.lcp}s!`
      });
    }

  } catch (error) {
    console.error('Error fetching metrics:', error);
  }
});

This simple script will run daily and notify your team via Slack if the Largest Contentful Paint metric exceeds the recommended 2.5 seconds.

Conclusion

Automating Page Speed and Core Web Vitals monitoring is essential for any modern web application. With the ToolCenter Page Speed API, you can easily integrate real-time performance tracking into your CI/CD pipelines, dashboards, or alerting systems—without the hassle of maintaining infrastructure.

Start monitoring your web performance today and keep your website lightning fast!