frontend-lighthouse
A portable Lighthouse CI performance gate that blocks PRs unless the production build meets Core Web Vitals budgets and category score floors, with median-of-N runs.
Source: Stareezy
At a glance
- Best for
- Adding a blocking Lighthouse CI gate on every PR
- Works with
- Cursor · OpenAI Codex · Claude Code
- Outcome
- Enforcing LCP/CLS budgets and TBT as an INP lab proxy
- Source
- stareezy-1/frontend-architecture-skill
01 / Understand the skill
About frontend-lighthouse
A portable, framework-agnostic Lighthouse CI performance-gate system for any web frontend. Enforces Core Web Vitals budgets (LCP, INP via the TBT lab proxy, CLS) and category score floors (performance, SEO, accessibility, best-practices) as a blocking CI check on every pull request. Runs Lighthouse against the production build with median-of-N runs for stability, on mobile emulation by default with an opt-in desktop form factor. Ships a single `lighthouserc.cjs` config, an npm `lhci` script, and a GitHub Actions workflow. Use this skill when adding performance gates to a project, configuring Lighthouse CI, tuning Core Web Vitals budgets, setting category score thresholds, wiring a Lighthouse GitHub Action, or debugging flaky or failing Lighthouse runs. Works with Next.js, Remix, Astro, SvelteKit, Vite, or any app that serves a production build over HTTP.
A portable, framework-agnostic Lighthouse CI performance-gate system for any web frontend. Enforces Core Web Vitals budgets (LCP, INP via the TBT lab proxy, CLS) and category score floors (performance, SEO, accessibility, best-practices) as a blocking CI check on every pull request.
Read full description
A portable, framework-agnostic Lighthouse CI performance-gate system for any web frontend. Enforces Core Web Vitals budgets (LCP, INP via the TBT lab proxy, CLS) and category score floors (performance, SEO, accessibility, best-practices) as a blocking CI check on every pull request. Runs Lighthouse against the production build with median-of-N runs for stability, on mobile emulation by default with an opt-in desktop form factor. Ships a single `lighthouserc.cjs` config, an npm `lhci` script, and a GitHub Actions workflow. Use this skill when adding performance gates to a project, configuring Lighthouse CI, tuning Core Web Vitals budgets, setting category score thresholds, wiring a Lighthouse GitHub Action, or debugging flaky or failing Lighthouse runs. Works with Next.js, Remix, Astro, SvelteKit, Vite, or any app that serves a production build over HTTP.
02 / Confirm the fit
Use frontend-lighthouse when you need to
- Adding a blocking Lighthouse CI gate on every PR
- Enforcing LCP/CLS budgets and TBT as an INP lab proxy
- Setting category score floors for perf, SEO, a11y, best-practices
- Wiring a stable median-of-N Lighthouse GitHub Action
03 / See the workflow
How frontend-lighthouse works
- 01Install: npx skills add https://github.com/stareezy-1/frontend-architecture-skill --skill frontend-lighthouse
- 02Try: Add a Lighthouse CI performance gate to my Next.js app.
- 03Get: A lighthouserc.cjs with budgets, an lhci script, and a PR-blocking GitHub Actions workflow.
Check before installing
Compatible platforms
Cursor · OpenAI Codex · Claude Code
Best fit
Adding a blocking Lighthouse CI gate on every PR
Review the source instructions if the required output differs from the formats described above.
Install and use
Compatible with Cursor and OpenAI Codex and Claude Code · Published by Stareezy
Ready to add frontend-lighthouse?
Use the published instructions below, then provide the required input and describe the result you need.
General instructions · Cursor · OpenAI Codex · Claude Code
npx skills add https://github.com/stareezy-1/frontend-architecture-skill --skill frontend-lighthouse
Review the source repository and license before installing third-party skills.
Continue exploring
Similar skills
Authoritative reference for the Claude API and Anthropic SDKs: model IDs, pricing, thinking/effort params, streaming, tool use, caching, managed agents, and model migration.
Read, edit, create, and fix Excel/CSV files — formulas, formatting, charts, and clean financial models with zero formula errors.
Generate distinctive, production-grade frontend UI that avoids generic AI aesthetics — pages, components, dashboards, and landing pages.
Build high-quality MCP (Model Context Protocol) servers in Python (FastMCP) or Node/TypeScript that let LLMs use external services through well-designed tools.