lib/pagespeed.ts — API call function

interface PageSpeedResult {
  url: string;
  strategy: "mobile" | "desktop";
  scores: {
    performance: number;
    accessibility: number;
    bestPractices: number;
    seo: number;
  };
  metrics: {
    fcp: string;    // First Contentful Paint
    lcp: string;    // Largest Contentful Paint
    cls: string;    // Cumulative Layout Shift
    tbt: string;    // Total Blocking Time
  };
}

export async function measurePageSpeed(
  url: string,
  strategy: "mobile" | "desktop" = "mobile"
): Promise<PageSpeedResult> {
  const apiKey = process.env.PAGESPEED_API_KEY;
  const apiUrl = "https://www.googleapis.com/pagespeedonline/v5/runPagespeed"
    + `?url=${encodeURIComponent(url)}`
    + `&strategy=${strategy}`
    + `&key=${apiKey}`
    + "&category=performance&category=accessibility"
    + "&category=best-practices&category=seo";

  const res = await fetch(apiUrl);
  const data = await res.json();

  const categories = data.lighthouseResult.categories;
  const audits = data.lighthouseResult.audits;

  return {
    url,
    strategy,
    scores: {
      performance: Math.round(categories.performance.score * 100),
      accessibility: Math.round(categories.accessibility.score * 100),
      bestPractices: Math.round(categories["best-practices"].score * 100),
      seo: Math.round(categories.seo.score * 100),
    },
    metrics: {
      fcp: audits["first-contentful-paint"].displayValue,
      lcp: audits["largest-contentful-paint"].displayValue,
      cls: audits["cumulative-layout-shift"].displayValue,
      tbt: audits["total-blocking-time"].displayValue,
    },
  };
}

Sequential full-site measurement

const pages = [
  { url: "https://example.com/", name: "Home" },
  { url: "https://example.com/blog", name: "Blog" },
  { url: "https://example.com/services", name: "Services" },
  { url: "https://example.com/support", name: "Support" },
  // ... full page list
];

async function measureAll() {
  const results: PageSpeedResult[] = [];

  for (const page of pages) {
    console.log(`Measuring: ${page.name} (${page.url})`);

    try {
      const result = await measurePageSpeed(page.url, "mobile");
      results.push(result);
      console.log(`  Performance: ${result.scores.performance}`);
    } catch (error) {
      console.error(`  Failed: ${page.name}`);
    }

    // Delay between requests to protect quota (3s)
    await new Promise(resolve => setTimeout(resolve, 3000));
  }

  return results;
}

Markdown report generator

function generateMarkdownReport(
  results: PageSpeedResult[]
): string {
  const date = new Date().toISOString().split("T")[0];

  let md = `# PageSpeed Report\n`;
  md += `Date: ${date}\n\n`;

  md += `| Page | Perf | A11y | BP | SEO | LCP |\n`;
  md += `|------|------|------|-----|-----|-----|\n`;

  for (const r of results) {
    const path = new URL(r.url).pathname || "/";
    md += `| ${path} `;
    md += `| ${r.scores.performance} `;
    md += `| ${r.scores.accessibility} `;
    md += `| ${r.scores.bestPractices} `;
    md += `| ${r.scores.seo} `;
    md += `| ${r.metrics.lcp} |\n`;
  }

  const avg = results.reduce(
    (sum, r) => sum + r.scores.performance, 0
  ) / results.length;
  md += `\n**Average Performance: ${Math.round(avg)}**\n`;

  return md;
}

Admin PageSpeed page (simplified)

"use client";
import { useState } from "react";

export default function PageSpeedAdmin() {
  const [results, setResults] = useState([]);
  const [measuring, setMeasuring] = useState(false);
  const [progress, setProgress] = useState("");

  const handleMeasure = async () => {
    setMeasuring(true);
    setProgress("Starting measurement...");

    const res = await fetch("/api/admin/pagespeed", {
      method: "POST",
    });

    // Receive progress via Server-Sent Events
    const reader = res.body?.getReader();
    // ... process results ...

    setMeasuring(false);
  };

  return (
    <div>
      <h1>PageSpeed Measurement</h1>
      <button onClick={handleMeasure} disabled={measuring}>
        {measuring ? progress : "Measure All Pages"}
      </button>
      {/* Results table */}
    </div>
  );
}

# Quota protection tips

// 1. Delay between requests (minimum 3s)
await new Promise(r => setTimeout(r, 3000));

// 2. Daily measurement cap
const MAX_DAILY_MEASUREMENTS = 100;
const todayCount = await getTodayMeasurementCount();
if (todayCount >= MAX_DAILY_MEASUREMENTS) {
  throw new Error("Daily measurement limit exceeded");
}

// 3. Cache results (prevent duplicate measurements)
const cached = await getCachedResult(url);
if (cached && isRecent(cached, 24)) {  // Within 24 hours
  return cached;
}