PageSpeed Insights API

Lighthouse — это инструмент для анализа производительности, доступности, SEO и лучших практик веб-страниц. PageSpeed Insights API предоставляет программный доступ к возможностям Lighthouse, позволяя интегрировать аудит страниц в автоматизированные процессы, CI/CD пайплайны и кастомные инструменты мониторинга.

Подключение и установка

PageSpeed Insights API доступен через HTTP-запросы к конечной точке:

https://www.googleapis.com/pagespeedonline/v5/runPagespeed

Ключевые параметры запроса:

  • url — адрес страницы для анализа.
  • strategy — стратегия анализа: desktop или mobile.
  • category — категории аудита: performance, accessibility, best-practices, seo, pwa.
  • locale — язык отчета, например ru_RU.
  • key — API-ключ Google Cloud для авторизации.

Пример запроса с использованием fetch в Node.js:

import fetch from 'node-fetch';

const apiKey = 'ВАШ_API_КЛЮЧ';
const urlToAnalyze = 'https://example.com';

async function analyzePage() {
  const response = await fetch(`https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=${encodeURIComponent(urlToAnalyze)}&strategy=mobile&key=${apiKey}`);
  const data = await response.json();
  console.log(data);
}

analyzePage();

Структура ответа API

Ответ API возвращается в формате JSON и состоит из нескольких ключевых секций:

  1. lighthouseResult — основная информация от Lighthouse:

    • categories — объект с оценками по категориям (Performance, Accessibility, SEO и др.).
    • audits — подробные аудиты, включающие метрики и рекомендации.
    • configSettings — настройки анализа, например стратегия и используемые категории.

  2. loadingExperience — данные о реальном пользовательском опыте (CrUX):

    • Метрики, основанные на реальных пользователях: FCP, LCP, CLS и др.
    • Классификация опыта: FAST, AVERAGE, SLOW.

  3. originLoadingExperience — показатели по всем страницам домена.

  4. version — версия Lighthouse, использованная для анализа.

Основные метрики производительности

В разделе lighthouseResult.audits содержатся ключевые показатели:

  • First Contentful Paint (FCP) — время до первого отображения контента.
  • Largest Contentful Paint (LCP) — время загрузки самого большого видимого элемента.
  • Cumulative Layout Shift (CLS) — суммарное смещение элементов страницы.
  • Total Blocking Time (TBT) — время, когда пользователь не может взаимодействовать со страницей.
  • Speed Index (SI) — индекс скорости визуализации контента.

Каждая метрика имеет:

  • score — оценка от 0 до 1.
  • displayValue — человекочитаемое значение, например “1.2 s”.
  • numericValue — численное значение метрики в миллисекундах или других единицах.

Примеры работы с результатами

Фильтрация критических аудитов для производительности:

const audits = data.lighthouseResult.audits;
const criticalAudits = Object.values(audits)
  .filter(audit => audit.score !== null && audit.score < 0.9)
  .map(audit => ({
    id: audit.id,
    title: audit.title,
    score: audit.score,
    description: audit.description
  }));

console.log(criticalAudits);

Настройка стратегий анализа

strategy определяет, как Lighthouse эмулирует устройство:

  • desktop — стандартная конфигурация для настольных браузеров, высокая пропускная способность сети и производительность процессора.
  • mobile — симуляция мобильного устройства с ограниченными ресурсами, эмуляция сети 4G и замедленного процессора.

Выбор стратегии влияет на результаты: мобильные пользователи чаще видят низкие показатели производительности, что позволяет выявлять узкие места для оптимизации интерфейса.

Локализация отчетов

С помощью параметра locale можно получать отчеты на нужном языке:

const locale = 'ru_RU';
const response = await fetch(`https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=${encodeURIComponent(urlToAnalyze)}&locale=${locale}&key=${apiKey}`);

Все текстовые поля, такие как title и description, будут возвращены на указанном языке, что удобно для интеграции в корпоративные инструменты.

Работа с категориями аудита

API позволяет запрашивать отдельные категории, снижая объем данных:

const categories = 'performance,seo';
const response = await fetch(`https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=${encodeURIComponent(urlToAnalyze)}&category=${categories}&key=${apiKey}`);
  • performance — скорость и отзывчивость.
  • seo — соответствие основным требованиям поисковой оптимизации.
  • accessibility — удобство для пользователей с ограничениями.
  • best-practices — соблюдение современных веб-стандартов.
  • pwa — проверка прогрессивного веб-приложения.

Автоматизация и интеграция

PageSpeed Insights API можно использовать для:

  • Мониторинга производительности всех страниц сайта.
  • Интеграции в CI/CD, чтобы проверять новые сборки перед деплоем.
  • Составления дашбордов с динамическими метриками по проекту.
  • Генерации PDF-отчетов и уведомлений при падении ключевых метрик.

Автоматизация включает:

  1. Создание скриптов на Node.js или Python.
  2. Планирование запросов через cron или CI-пайплайны.
  3. Хранение результатов в базе данных для анализа трендов.
  4. Визуализацию через графики и метрики на дашбордах.

Ограничения и рекомендации

  • API имеет лимиты по количеству запросов на ключ, что важно учитывать при массовом мониторинге.
  • В отчете могут отсутствовать некоторые метрики, если страница не полностью загружается или блокируется JavaScript.
  • Для стабильных результатов рекомендуется тестировать страницы в одно и то же время суток, минимизируя влияние сетевой нестабильности.

Эта подробная структура позволяет эффективно использовать PageSpeed Insights API для анализа, мониторинга и оптимизации веб-проектов, комбинируя возможности Lighthouse и данные реального пользовательского опыта.

Оглавление