Skip to main content

lighthouse-ci-budgets

lighthouse-ci-budgets

Catalogue généré le 2026-05-11

En une phrase

Mettre en placeConfigure Lighthouse CI +dans assertions/budgetston pipeline pour éviterqu'il bloque automatiquement les régressions perf/a11y/SEO.performance, Àaccessibilité utiliserou quandSEO via des assertions et budgets définis dans un projetfichier ade CI/CD ou plusieurs contributeurs.config.

Quand l'utiliser

  • VoirSur un projet avec CI/CD (GitHub Actions, GitLab CI) et plusieurs contributeurs
Quand tu veux te protéger contre les régressions de perf après un merge Pour fixer des seuils minimum acceptables (score perf > 80, LCP < 2.5s, etc.) Sur un projet client qui a un engagement de qualité contractuel Pour automatiser ce qui se fait sinon à la descriptionmain ci-dessusavant etchaque la section « Pour aller plus loin ».déploiement

Comment l'invoquer

  • Slash command : /lighthouse-ci-budgets (si exposé dans ton CLI)
Phrases déclencheurs : voir la description complète ci-dessous Auto-invocation : sur demandeOui explicite— quand un projet a CI/CD ou plusieurs contributeurs

PourDescription aller plus loindétaillée

Lighthouse CI +est Budgetsla

Objectif

version automatisable de Lighthouse (l'outil intégré dans Chrome DevTools). Au lieu de cliquer dans le navigateur après chaque déploiement, tu le branches sur ta pipeline et il tourne tout seul, comparant les résultats à des seuils que tu as définis. Si une régression dépasse le seuil, la pipeline échoue et le merge est bloqué.

AutomatiserCe skill produit quatre choses concrètes : un contrôlefichier qualitéde (perf/a11y/bp/seo) et bloquer les régressions via budgets/assertions.

Output attendu

    Exempleconfig lighthouserc.json (ou .lighthouserc.js) Commandessi tu préfères du JS) avec les assertions et budgets paramétrés, les scripts npm scriptspour Exemplelancer Lighthouse CI en local et en CI (lhci autorun, lhci collect, lhci assert), un exemple GitHub Action (optionnel)prêt Budgetsà coller dans .github/workflows/lighthouse.yml, et un set de budgets initiaux réalistes +(taille JS, CSS, images, fonts) plus les seuils minimum

    Notes(score d’perf, a11y, SEO, best practices).

    Deux conseils d'usage

      importants Démarrer: démarrer avec des seuils réalistes,réalistes basés sur l'existant — si tu mets perf > 95 alors que le site est à 72, tu vas être en CI rouge pour toujours — puis resserrer.resserrer Multirunprogressivement. Et activer le multirun (3 ou 5 exécutions par audit) pour réduire variance.la variance naturelle de Lighthouse qui peut donner +/- 5 points entre deux runs.

      Pour Thymon : utile sur les projets qui partent en production sérieuse et où tu veux dormir tranquille, moins pertinent sur un side project où tu fais déjà attention à la main.

      Source

      • Plugin : perso (standalone)
      • Nom interne : lighthouse-ci-budgets
      • Fichier : /home/thymon/.claude/skills/lighthouse-ci-budgets/SKILL.md