События и callbacks

Библиотека Lighthouse в JavaScript предоставляет мощный инструмент для аудита веб-страниц. Одним из ключевых аспектов работы с Lighthouse является использование событий и callbacks для отслеживания прогресса аудита и обработки результатов.

События в Lighthouse

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

  1. Старт и завершение аудита

    • startAudit — вызывается при начале аудита, может использоваться для логирования или отображения индикатора загрузки.
    • endAudit — вызывается после завершения всех проверок, предоставляет финальный отчет.

  2. Промежуточный прогресс

    • auditProgress — генерируется на каждой стадии аудита отдельного категории, передаёт объект с информацией о текущей категории и выполненных шагах.
    • fetchProgress — сигнализирует о процессе загрузки ресурсов, что позволяет отслеживать сетевые запросы и их время.

  3. Ошибки и предупреждения

    • auditError — уведомляет о критических ошибках в процессе проверки.
    • auditWarning — информирует о потенциальных проблемах, которые не блокируют выполнение аудита.

События можно слушать через объект EventEmitter, который используется внутри Lighthouse:

const EventEmitter = require('events');
const emitter = new EventEmitter();

emitter.on('startAudit', () => {
  console.log('Аудит начат');
});

emitter.on('endAudit', (report) => {
  console.log('Аудит завершен');
  console.log(report);
});

Callbacks для обработки результатов

Callbacks в Lighthouse позволяют обработать данные после выполнения определённого шага аудита. Они обеспечивают асинхронную реакцию на события без блокировки основного потока.

Примеры использования:

  1. Обработка категории аудита
function handleCategoryResult(categoryResult) {
  console.log(`Результаты категории ${categoryResult.id}:`);
  categoryResult.auditRefs.forEach(audit => {
    console.log(`- ${audit.id}: ${audit.score}`);
  });
}

Callback передаётся в функцию, которая запускает аудит:

const lighthouse = require('lighthouse');

lighthouse('https://example.com', { output: 'json' })
  .then(results => handleCategoryResult(results.lhr.categories))
  .catch(error => console.error(error));
  1. Асинхронные callbacks для прогресса
function onAuditProgress(progress) {
  console.log(`Прогресс: ${progress.step} из ${progress.totalSteps}`);
}

// Использование вместе с событием auditProgress
emitter.on('auditProgress', onAuditProgress);

Взаимодействие событий и callbacks

События и callbacks в Lighthouse часто используются совместно для построения сложной логики мониторинга аудита. Например, можно использовать событие auditProgress для обновления индикатора выполнения и одновременно передавать промежуточные результаты в callback для анализа:

emitter.on('auditProgress', progress => {
  updateUI(progress); // Обновление визуального прогресс-бара
  processPartialResults(progress, result => {
    console.log('Обработанные промежуточные данные:', result);
  });
});

Практические рекомендации

  • Всегда использовать try/catch в callback для предотвращения сбоев из-за ошибок в обработчиках.
  • Разделять обработку событий и callbacks: события — для уведомления о состоянии, callbacks — для анализа данных.
  • Использовать события auditError и auditWarning для построения системы логирования и мониторинга.
  • При необходимости комбинировать несколько callbacks, например, один для логирования, другой — для сохранения результатов в базу данных.

Поддержка асинхронных операций

Lighthouse активно использует асинхронность. Callbacks могут быть промисами или функциями async/await. Пример:

async function handleAuditResultAsync(result) {
  try {
    const data = await processData(result);
    console.log('Асинхронно обработанные данные:', data);
  } catch (err) {
    console.error('Ошибка при обработке данных:', err);
  }
}

lighthouse('https://example.com', { output: 'json' })
  .then(results => handleAuditResultAsync(results.lhr))
  .catch(err => console.error(err));

Настройка пользовательских событий

Lighthouse позволяет расширять стандартный набор событий, создавая кастомные события. Это полезно для интеграции с собственными системами аналитики или CI/CD пайплайнами:

emitter.emit('customEvent', { message: 'Начало интеграционного аудита' });
emitter.on('customEvent', data => console.log(data.message));

Кастомные события можно сочетать с callbacks для гибкой обработки и интеграции с внешними инструментами.

Выводы по структуре

  • События фиксируют этапы и состояние аудита.
  • Callbacks обеспечивают обработку результатов и данных.
  • Асинхронные конструкции позволяют безопасно работать с большими отчетами и сетевыми ресурсами.
  • Совместное использование событий и callbacks создаёт надёжную архитектуру мониторинга аудита, легко расширяемую под специфические задачи проекта.

Эта модель построения взаимодействия между событиями и callbacks является фундаментальной для эффективного применения Lighthouse в реальных проектах, обеспечивая прозрачность процессов аудита и возможность детальной аналитики на каждом этапе.

Оглавление