Рубрики
Uncategorized

Автоматизированная оценка маяка до вашего PR (с действиями Vercel и GitHub)

TLDR дай мне код сейчас! Представьте себе дружественный бот действий GitHub, который добавляет это ко всем PRS (на C … Теги с WebPerf, WebDev, Github, Devops.

TLDR дай мне код сейчас!

Представьте себе дружелюбный бот действий GitHub, который добавляет это ко всем PRS (за Commit) к вашему репо:

Метрики зеленого маяка

Веб-страницы с метриками Google Lighthouse, которые являются зелеными), как правило, являются быстрее, более доступными и приходят с лучшим пользователем. Если вы, как разработчик, можете помочь вашей компании улучшить эти метрики, это напрямую повлияет на нижнюю строку ваших компаний (+ помогите с вашим планным маркетинговым усилиями и SEO).

Первый шаг к зеленым метрикам маяка — измерить метрики. Сделайте это легко для вас, и ваших собратьев разработчиков, чтобы увидеть, как ваш код меняется, влияет на метрики маяка, включая метрики как часть вашего PRS.

Действие GitHub Рабочий процесс

  1. Получите превью URL для PR (от Vercel).
  2. Запустите аудит маяка на URL-адрес предварительного просмотра с Этот плагин Отказ
  3. Формат счет до таблицы (+ бросить несколько эмоджис).
  4. Разместите комментарий на PR с отформатированным баллом.

Комментарий на PR будет липким комментарием — например Если комментарий существует обновление, он еще добавьте новый комментарий.

Полное действие можно найти здесь здесь Отказ Не стесняйтесь скопировать вставьте это действие на ваше репо.

Использованные интеграции:

Не использует vercel?

  • Обновление шага 1 действия (и получите URL-адрес предварительного просмотра от E.G. NetLify или из собственной настройки развертывания)

Ограничения:

  • Всегда управляет аудитом маяка на корневой странице.

Дальнейшие улучшения:

  • Объедините действие с помощью бюджет Для предотвращения PRS, которые приносят метрики ниже установленного трещита.
  • Запустите аудит только на страницах, затронутых пр.
  • Сравните собранные метрики с фактическими показателями вашей производственной площадки.

Это помогло тебе? Как и поделитесь статьей и следуй за мной в Twitter (я строю Блестеть — Веб-видео редактор).

Оригинал: «https://dev.to/oskarahl/automated-lighthouse-score-on-your-pr-with-vercel-and-github-actions-2ng2»