Процесс сбора данных

Lighthouse — это инструмент для анализа качества веб-страниц, разработанный Google. Для работы с ним через JavaScript используется пакет lighthouse, который устанавливается через npm:

npm install -g lighthouse

В среде Node.js подключение осуществляется стандартным require:

const lighthouse = require('lighthouse');
const chromeLauncher = require('chrome-launcher');

chrome-launcher необходим для запуска экземпляра Chrome в режиме, подходящем для аудита.

Запуск Chrome для аудита

Для сбора данных Lighthouse требуется экземпляр Chrome, запущенный с удаленным дебаг-портом:

async function launchChrome() {
    return await chromeLauncher.launch({
        chromeFlags: ['--headless', '--disable-gpu', '--no-sandbox']
    });
}
  • --headless позволяет запускать Chrome без GUI, ускоряя процесс.
  • --disable-gpu отключает аппаратное ускорение, что минимизирует влияние на показатели.
  • --no-sandbox требуется в некоторых окружениях для корректного запуска без прав администратора.

После запуска Chrome возвращается объект с портом, который используется для подключения Lighthouse.

Конфигурация и опции аудита

Основной объект опций Lighthouse содержит следующие ключевые параметры:

const options = {
    port: chrome.port,          // порт, на котором запущен Chrome
    output: 'json',             // формат отчета: json или html
    onlyCategories: ['performance', 'accessibility', 'best-practices', 'seo', 'pwa'], // выбор категорий
};
  • port — обязательный параметр для подключения к экземпляру Chrome.
  • output — формат отчета, который затем можно сохранить или обработать программно.
  • onlyCategories — позволяет ограничить аудит выбранными категориями, ускоряя сбор данных.

Можно дополнительно использовать settings для тонкой настройки:

options.settings = {
    emulatedFormFactor: 'desktop', // 'mobile' или 'desktop'
    throttlingMethod: 'simulate',  // режим эмуляции сетевых условий
    screenEmulation: {
        width: 1920,
        height: 1080,
        deviceScaleFactor: 1,
        mobile: false
    }
};

Эти параметры позволяют контролировать условия, в которых Lighthouse собирает данные, что критично для воспроизводимости результатов.

Запуск аудита

Аудит веб-страницы выполняется функцией lighthouse(url, options), которая возвращает промис с результатами:

async function runLighthouse(url) {
    const result = await lighthouse(url, options);
    return result.lhr; // Lighthouse Report Object
}

Объект lhr содержит подробные данные по каждой категории аудита, включая показатели производительности, доступности, SEO и рекомендации.

Обработка и сохранение данных

Собранные данные могут быть сохранены в файл для последующего анализа:

const fs = require('fs');

fs.writeFileSync('report.json', JSON.stringify(result.lhr, null, 2));

Формат JSON позволяет интегрировать данные с системами Continuous Integration, строить графики динамики показателей и анализировать изменения между версиями страниц.

Структура данных Lighthouse

Объект отчета (lhr) включает несколько ключевых разделов:

  • categories — оценки по основным категориям с разбивкой на конкретные аудиты.
  • audits — детализированные проверки с метриками, описаниями и рекомендациями.
  • configSettings — параметры конфигурации, использованные при сборе данных.
  • fetchTime — временная метка проведения аудита.
  • finalUrl — URL, по которому был проведен аудит.

Каждый аудит содержит:

  • score — числовое значение от 0 до 1.
  • numericValue — измеренное значение метрики (например, время загрузки).
  • displayValue — человекочитаемое представление метрики.
  • details — дополнительные данные, включая таблицы, графики и скриншоты.

Подход к масштабированию сбора данных

Для аудита множества страниц можно использовать асинхронные функции и параллельный запуск нескольких экземпляров Chrome:

const urls = ['https://example.com', 'https://example.org'];

async function auditMultiplePages(urls) {
    const results = [];
    for (const url of urls) {
        const chrome = await launchChrome();
        const result = await runLighthouse(url, { port: chrome.port });
        results.push(result);
        await chrome.kill();
    }
    return results;
}

Важно закрывать каждый экземпляр Chrome после завершения аудита, чтобы избежать утечек памяти и конфликтов портов.

Использование эмуляции сети и устройства

Для более точного моделирования пользовательского опыта Lighthouse поддерживает:

  • Throttling network — ограничение пропускной способности для симуляции медленного интернета.
  • CPU throttling — замедление процессора для проверки производительности на слабых устройствах.
  • Device emulation — имитация характеристик мобильных устройств, включая разрешение, pixel ratio и сенсорный ввод.

Пример настройки:

options.throttling = {
    rttMs: 150,
    throughputKbps: 1638.4,
    cpuSlowdownMultiplier: 4,
    requestLatencyMs: 150,
    downloadThroughputKbps: 1638.4,
    uploadThroughputKbps: 768
};

Эти настройки критичны для оценки реального пользовательского опыта, а не только скорости локальной машины.

Логирование и мониторинг

Для отладки процесса сбора данных удобно логировать ключевые события:

console.log(`Запуск аудита: ${url}`);
console.log(`Результат: ${result.categories.performance.score}`);

Это позволяет отслеживать прогресс при массовом аудите страниц и выявлять ошибки подключения или падения Chrome.

Автоматизация в CI/CD

Lighthouse легко интегрируется с системами CI/CD. JSON-отчеты могут анализироваться скриптами, сравниваться с предыдущими результатами и использоваться для создания метрик качества, чтобы блокировать коммиты с ухудшением производительности или доступности.

Использование Node.js и lighthouse в качестве API позволяет строить полностью автоматизированные пайплайны сбора данных без необходимости ручного запуска Chrome или браузерных расширений.

Оглавление