Automating Web Performance Monitoring with PSI API

Monitoring Speed with the PageSpeed Insights API

Page load speed directly impacts conversion rates and SEO. Manually tracking it is not an engineer’s job: running Lighthouse after every deployment wastes time. Without automation, you risk missing degradation that hurts your rankings. We offer automated Core Web Vitals monitoring (CWV automation) using the PageSpeed Insights API, per the official documentation at developers.google.com. This free service returns two data types: lab (Lighthouse) and field (Chrome UX Report). Lab data reacts instantly; field data accumulates over 28 days. Together they give the full picture.

How Monitoring Works

PSI API is free: up to 25,000 requests per day with a key. The key is created in Google Cloud Console. We prepare a Python script that collects metrics for priority pages (homepage, categories, product cards, cart) and stores them in PostgreSQL. The script runs on a schedule (e.g., every 24 hours via cron) and processes up to a hundred URLs per run.

import requests
from typing import Literal

PSI_API_URL = 'https://www.googleapis.com/pagespeedonline/v5/runPagespeed'

def fetch_psi(url, api_key, strategy):
    params = {
        'url': url,
        'key': api_key,
        'strategy': strategy,
        'category': ['performance'],
    }
    resp = requests.get(PSI_API_URL, params=params, timeout=60)
    resp.raise_for_status()
    return resp.json()

def extract_metrics(response):
    field = response.get('loadingExperience', {})
    lab = response.get('lighthouseResult', {})
    # extract field and lab metrics
    return {'field': field, 'lab': lab}

Which Metrics We Track

We also record the Lighthouse Performance score. For each URL we keep a history — you can compare today’s measurement with yesterday’s and detect trends.

How to Set Up Alerts for Core Web Vitals Degradation

Define thresholds. For example, if LCP exceeds 4 seconds or Performance score drops below 70 — send a notification via Telegram or email. Thresholds are customized per project: stricter for e-commerce, softer for blogs.

THRESHOLDS = {
    'lab_performance_score': 0.7,
    'lab_lcp_ms': 4000,
    'field_lcp_category': 'SLOW',
}

def check_alerts(current, thresholds):
    alerts = []
    if current['lab']['performance_score'] < thresholds['lab_performance_score']:
        alerts.append(f"Performance score dropped to {current['lab']['performance_score']*100}%")
    # other checks
    return alerts

We compare against the previous measurement: if a metric worsened by more than 10%, we also alert. This catches degradation even within the "green" zone. For typical PSI variance (5–15%), we use the median of three runs.

PSI API vs Local Lighthouse Comparison

PSI API is 10x cheaper than commercial services (e.g., SpeedCurve at $100/month) and provides field metrics unavailable to local Lighthouse. Switching to PSI can save up to $2,000 per year.

Step-by-Step Integration Process

1. Obtain API key from Google Cloud Console.
2. Define list of pages to monitor.
3. Run the Python ingestion script on a cron job (daily).
4. Set up PostgreSQL database to store historical data.
5. Configure alert rules (Telegram, email, Slack).
6. (Optional) Create Grafana dashboard for visualization.
7. (Optional) Integrate with CI/CD pipeline (e.g., GitHub Actions).

What Is Included in the Work

• Obtaining and configuring the API key
• Metric collection script for N pages (you define the list)
• Database for storing history (PostgreSQL)
• Degradation alerts (Telegram, email, Slack — your choice)
• Grafana dashboard for trend visualization
• CI/CD integration: automatic run before every deployment
• Documentation and training for your team
• Access to all dashboards and configuration

Why Both Data Types Matter

Lab data reacts instantly — you see the effect of every code change. Field data lags by 28 days but shows real-world experience. Only together they give complete information. For example, you improved LCP on a test environment, but in the field it's still poor — the issue lies elsewhere (slow server, heavy JavaScript).

PSI API Limitations

The API runs Lighthouse on Google’s servers; results vary by 5–15%. We run three measurements and take the median. For authenticated pages (e.g., personal account), we use local Lighthouse via Node.js. Field data requires sufficient traffic — at least a few hundred visits per month per page.

Timeline, Cost, and Offer

Basic integration (collection + alerts) takes 1–2 business days. Extended version with Grafana and CI/CD takes 3–4 days. We offer a turnkey solution: from API key setup to Grafana dashboard, alerts, and documentation. Pricing is individual — contact us for a preliminary estimate. Typical savings: up to $2,000/year by replacing commercial services.

Experience and Guarantees

With 5+ years of expertise and 50+ completed projects in web performance optimization and monitoring, we guarantee stable script operation, 24/7 alerting, and fast feedback. Our solutions are battle-tested for e-commerce, media, and SaaS.

Order monitoring setup, and we will prepare a solution for your stack.

Why are Core Web Vitals critical for technical SEO?

PageSpeed 34/100 on mobile. Search Console shows red on all category pages. A competitor with an older site outranks you despite weaker content. Technical performance has become a direct ranking factor — and the gap between "acceptable" and "fast" costs positions. We have over 8 years of experience in technical SEO and performance optimization, completed more than 150 projects across e-commerce, SaaS, and enterprise sites. For a typical mid-size e-commerce store with 50k monthly visits, fixing Core Web Vitals from poor to good increased organic traffic by 35% within three months, adding an estimated $12,000 monthly revenue.

Core Web Vitals: what really affects rankings

Google uses three metrics as ranking signals (Page Experience): Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), Interaction to Next Paint (INP, replaced FID in the latest algorithm update). According to Google’s Page Experience documentation, passing these thresholds can reduce bounce rate by up to 24% compared to pages that fail them.

LCP: why 8 seconds is not an image problem

LCP measures rendering time of the largest visible element. Good <2.5s, poor >4s.

Real case: online clothing store, LCP 7.8s on mobile. Hero image 4.2MB JPEG without srcset, loaded via CSS background-image (not <img>). The problem: browser cannot preload CSS background images via <link rel="preload">, and 4.2MB on mobile connection is slow.

Solution:

1. Move to <img> with fetchpriority="high" and loading="eager"
2. Convert to WebP, add srcset: 800w for mobile, 1400w for desktop
3. <link rel="preload" as="image" href="hero-800.webp" media="(max-width: 768px)"> in <head>
4. Remove render-blocking scripts above hero with defer

Result: LCP 7.8s → 1.9s without changing hosting or CDN. That's 4x faster — a competitive advantage in search ranking.

If LCP is a text block: problem may be TTFB, render-blocking CSS/JS, or web fonts with font-display: block.

CLS: what causes layout shifts and how to stop them

CLS measures cumulative layout shift. Good <0.1, poor >0.25. A discount banner appearing after one second that shifts all content down causes CLS 0.35.

Sources:

• Images without dimensions. <img src="photo.jpg"> without width/height — browser doesn't reserve space. Fix: explicit width/height or aspect-ratio in CSS.
• Ad blocks and widgets — Google Ads, chat, cookie consent. Reserve space via min-height or load before main content.
• Web fonts. font-display: swap with size-adjust minimizes CLS.
• Dynamic content — add skeleton placeholder with dimensions.

INP: why interface freezes for 500ms

INP measures response delay to any user interaction. Good <200ms, poor >500ms. INP 680ms means user presses filter button and waits half a second.

Main cause: blocked main thread. A 2.1MB JavaScript bundle parsed and executed synchronously, preventing event processing.

Diagnosis: Chrome DevTools → Performance → interact → find Long Tasks (>50ms). Typical culprits:

• Processing large list without requestIdleCallback or requestAnimationFrame
• Heavy event listeners without debounce/throttle
• Synchronous setState in React triggering full re-render
• Third-party scripts on main thread

Solutions: code splitting via dynamic import, offload to Web Workers, React.memo + useMemo, Scheduler API.

How do structured data and Schema.org improve search visibility?

Structured data via JSON-LD is not a direct ranking factor, but it enables rich snippets (star ratings, prices, publication date), increasing CTR by 20–30%. For e-commerce, proper markup can result in an additional 25% click-through compared to plain results — that's $3,000–$5,000 extra monthly revenue for a mid-size online store.

Markup types by scenario:

• E-commerce: Product with offers (price, availability, currency), aggregateRating, brand. BreadcrumbList, ItemList.
• Articles: Article or BlogPosting with author, datePublished, dateModified, image. Organization and WebSite.
• Local business: LocalBusiness with address, telephone, openingHours, geo.
• FAQ: FAQPage with mainEntity — questions appear as expandable block.

Validation: Google Rich Results Test, Schema Markup Validator. Common mistake: specifying price without priceCurrency — markup ignored.

How to conduct a technical SEO audit

Crawlability. robots.txt blocks necessary pages or doesn't block service pages. Canonical URLs incorrectly set — duplicates with UTM parameters. Sitemap contains noindex pages. Tools like Screaming Frog or Sitebulb show this in an hour.

Core Web Vitals at scale. Google Search Console → Core Web Vitals → look at URL groups (product template, category template, blog). Problem is usually systemic.

JavaScript SEO. Google renders JS with delay. For critical content, SSR or SSG are mandatory. Check via Search Console → Inspect URL → View Crawled Page.

Internal linking. Orphan pages lose PageRank. Broken links (404) are a quality signal.

Common mistakes when implementing Schema.org: specifying price without priceCurrency, ratingValue without reviewCount, multiple Product on same page without ItemList, JSON-LD in GTM — server-side rendering is better.

What does the optimization process look like?

What deliverables do you receive?

• Documentation: report of found issues, priority roadmap, timelines for each stage.
• Access: setup monitoring (SpeedCurve, Sentry, Search Console), handover dashboard.
• Training: one or two calls reviewing typical mistakes for your team.
• Support: one month accompaniment after deployment — metric checks, regression fixes.

How many positions can you regain through technical SEO?

We have 5+ years on the market and 150+ projects completed. For a case study: a SaaS platform with 200k monthly visits had LCP 6.2s, CLS 0.45, INP 600ms. After optimization, LCP dropped to 1.8s, CLS to 0.02, INP to 180ms. Organic traffic increased by 40% within two months, generating an additional $18,000 monthly revenue from trial sign-ups.

Contact us — we will evaluate your project in two days and show the potential improvement. Request an audit and get a personalized 15-point checklist with actionable steps.