skills.rest
cropsgg
cropsggCOMMUNITY
Explore all skills by this author →
GitHub

benchmark

Measure Core Web Vitals and bundle sizes before and after PR changes.

15|5|Updated May 17, 2026
Search Tags:#lighthouse#benchmark#pull-request#web-vitals#bundle-size#frontend-performance#regression-detection
One-click install
npx skills add https://github.com/cropsgg/skills --skill benchmark-cropsgg
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: benchmark
Source: https://github.com/cropsgg/skills/tree/main/skills/productivity/benchmark
Command: npx skills add https://github.com/cropsgg/skills --skill benchmark-cropsgg

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Baseline and monitor front-end performance changes introduced by PRs by measuring Core Web Vitals and bundle sizes, enabling fast detection of regressions that impact user experience.

Core Features & Use Cases

  • Baseline Core Web Vitals (LCP, CLS, INP, TBT) and bundle sizes before and after PRs.
  • Detect regressions greater than 5% and mark them as blocking for performance-critical paths.
  • Provide a repeatable, auditable workflow with delta reports and actionable recommendations.

Quick Start

Run a before/after benchmark on a PR diff to capture LCP, CLS, INP, TBT, speed index, and bundle size changes.

Frequently Asked Questions about benchmark

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I catch Core Web Vitals regressions in a pull request?▼

To catch Core Web Vitals regressions in a pull request, run before and after benchmarks using Lighthouse-compatible runs to measure LCP, CLS, INP, and TBT deltas. Regressions exceeding a 5% threshold are flagged as blocking.

What metrics are measured when benchmarking frontend performance?▼

Benchmarking frontend performance measures Core Web Vitals including LCP, CLS, INP, TBT, speed index, and bundle sizes. These metrics capture rendering logic, JS, CSS, and image changes to detect regressions.

Do I need a headless browser to measure bundle size changes?▼

You need a headless browser or Lighthouse-compatible tooling to measure bundle size changes and web vitals. A consistent benchmarking environment is required for accurate delta reporting and regression detection.

How do I establish a baseline for frontend bundle sizes before merging?▼

Establish a baseline for frontend bundle sizes by running a benchmark on the main branch before applying PR changes. Compare subsequent runs against this baseline to identify JS and CSS size regressions using the 5% threshold.

What is the regression threshold for blocking performance changes?▼

The regression threshold for blocking performance changes is 5%. Any Core Web Vitals or bundle size regressions exceeding this 5% threshold are marked as blocking for performance-critical paths.

Related Skills

Explore More Software Engineering Skills→
doanchienthangdevdoanchienthangdev
4

profiling-performance

Run Lighthouse audits and analyze Core Web Vitals for browser performance.

Community
Intermediate
ewhauserewhauser
106

bench-compare

Compare Criterion and hyperfine benchmark deltas between two git worktrees.

Community
Advanced
JaykaijackJaykaijack

benchmark

Measure browser performance metrics and compare them to stored baselines.

Community
Advanced
achmfachmf

performance-profiling

Run Lighthouse audits to analyze Core Web Vitals and rendering bottlenecks.

Community
Intermediate