performance-budget-enforcer

# Performance Budget Enforcer

Implement automated performance monitoring and budget enforcement to prevent performance regressions in worldbuilding applications.

## Overview

To enforce performance budgets:

1. Define performance budgets for key metrics (bundle size, Lighthouse scores, Web Vitals)
2. Set up automated monitoring in CI/CD pipeline
3. Configure alerts for threshold violations
4. Generate performance reports and trends
5. Block deployments that exceed budgets

## Performance Metrics

### JavaScript Bundle Size

To monitor bundle sizes:

- **Initial Bundle**: First-load JS (target: <200KB)
- **Route Bundles**: Per-page JS (target: <50KB per route)
- **Total Bundle**: All JS combined (target: <500KB)
- **Vendor Bundle**: Third-party libraries (target: <150KB)

### Lighthouse Scores

To track Lighthouse metrics:

- **Performance**: Overall performance score (target: >90)
- **Accessibility**: A11y compliance (target: >90)
- **Best Practices**: Web standards compliance (target: >90)
- **SEO**: Search engine optimization (target: >90)

### Core Web Vitals

To measure user experience:

- **LCP** (Largest Contentful Paint): <2.5s
- **FID** (First Input Delay): <100ms
- **CLS** (Cumulative Layout Shift): <0.1
- **TTFB** (Time to First Byte): <600ms
- **FCP** (First Contentful Paint): <1.8s

Consult `references/performance-targets.md` for detailed target definitions and industry benchmarks.

## Budget Configuration

### Define Budgets

Create `performance-budget.json`:

```json
{
  "bundles": {
    "maxInitialBundle": 204800,
    "maxRouteBundle": 51200,
    "maxTotalBundle": 512000,
    "maxVendorBundle": 153600
  },
  "lighthouse": {
    "performance": 90,
    "accessibility": 90,
    "bestPractices": 90,
    "seo": 90
  },
  "webVitals": {
    "lcp": 2500,
    "fid": 100,
    "cls": 0.1,
    "ttfb": 600,
    "fcp": 1800
  },
  "assets": {
    "maxImageSize": 102400,
    "maxFontSize": 51200,
    "maxCssSize": 51200
  }
}
```

Use `scripts/generate_budget.py`