skills.rest
mattbutlerengineering
mattbutlerengineeringCOMMUNITY
Explore all skills by this author →
GitHub

perf-budget

Compare modified packages' builds against configured size-limit baselines to detect bundle regressions.

1|Updated Jan 24, 2026
Search Tags:#bundle size#pnpm#regression testing#code splitting#JavaScript#tree-shaking#size-limit
One-click install
npx skills add https://github.com/mattbutlerengineering/mattbutlerengineering --skill perf-budget
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: perf-budget
Source: https://github.com/mattbutlerengineering/mattbutlerengineering/tree/main/.claude/skills/perf-budget
Command: npx skills add https://github.com/mattbutlerengineering/mattbutlerengineering --skill perf-budget

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Prevents unexpected front-end bundle growth by checking current build output against established size-limit baselines, so regressions are caught before they reach users.

Core Features & Use Cases

  • Regression detection: Runs size-limit for the current changes and identifies which entries exceed their configured budgets.
  • Targeted scope: Detects which apps/* or packages/* were modified and builds only the affected packages to keep checks fast.
  • Actionable output: Reports failing budget lines and how much they exceeded, with guidance to fix causes like new heavy dependencies or missing tree-shaking/code-splitting.

Quick Start

Run the perf-budget Skill to compare your current changes against size-limit baselines and get a clear regression report.

Frequently Asked Questions about perf-budget

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

FAQPage Schema
What is bundle size regression testing and how does it work?▼

Bundle size regression testing prevents unexpected front-end growth by checking current build output against established size-limit baselines. It identifies which modified packages exceed configured budgets, helping catch regressions before they reach users.

Does this bundle size check work with pnpm monorepos containing multiple apps and packages?▼

To check which packages exceed their size-limit budget, run a size check that reports failing budget lines and exactly how much they exceeded. This process builds only the modified packages detected via git diff to keep the validation fast.

What causes JavaScript bundle size regressions and how do I fix missing tree-shaking?▼

Yes, the bundle size check works with pnpm monorepos by using git diff to detect modified apps or packages and building only those affected directories. This targeted scope ensures the size-limit validation remains fast across monorepo projects.

Can I generate a detailed bundle size report with overage attribution for stakeholders?▼

JavaScript bundle size regressions are often caused by new heavy dependencies or missing tree-shaking and code-splitting. The size report attributes the overage to specific budget lines and provides remediation guidance to address these specific build issues.

Can I generate a detailed bundle size report with overage attribution for stakeholders?▼

Yes, you can generate a detailed bundle size report with overage attribution and remediation suggestions. This report clarifies why bundle size increased for stakeholders by detailing failing budget lines and exactly how much they exceeded the baseline.

Related Skills

Explore More Software Engineering Skills→
pau-vegapau-vega

monorepo-checker

Audit pnpm and Turborepo workspace packages for required scripts and config files.

Community
Intermediate
helderbertohelderberto
12

perf-audit

Analyze frontend bundle outputs and enforce size budgets for Vite, Webpack, Next.js, or Rollup.

Community
Advanced
getsentrygetsentry
8.7k

bump-size-limit

Adjust bundle size limits in `.size-limit.js` when CI checks fail.

Official
Intermediate
hiddink-aihiddink-ai
1

optimize-analyze

Analyze webpack, vite, and rollup build outputs for bundle size metrics.

Official
Intermediate