Performance-Budget: Definition, Beispiele, CI-Integration

Was ist ein Performance-Budget?

Ein Performance-Budget ist ein Set von expliziten Limits auf Web-Performance-Metrics — Bundle-Sizes, Page-Weight, Core Web Vitals (LCP, INP, CLS), Request-Counts, Third-party-Script-Weight — zu denen sich das Team commitet. Enforced in CI failed das Budget Builds, die Limits überschreiten, und verhindert Performance-Regressions vom Shippen.

Ohne Budget ist Perf-Rot invisible. Ein Budget macht den Cost sichtbar.

Kategorien von Performance-Budgets

Beispiel Performance-Budget

[
  {
    "path": "/*",
    "timings": [{ "metric": "interactive", "budget": 3000 }],
    "resourceSizes": [
      { "resourceType": "script", "budget": 200 },
      { "resourceType": "image", "budget": 500 },
      { "resourceType": "total", "budget": 1500 }
    ]
  }
]

Empfohlene Baselines

Tools zum Enforcing

Wo starten

1. Current Performance auditen
2. Budget at Current Baseline setzen
3. Lighthouse CI hinzufügen
4. PRs failen die Budget exceeden
5. Iterieren: Budget tightnen

Performance-Budget Best Practices

• Mit current Performance starten.
• Budget per Page-Type.
• Loud failen in CI.
• Trends tracken.
• Auf langsamen Devices testen.
• Third-party-Impact separat tracken.
• Owner per Metric.
• Visible in Dashboard.

Häufige Fallstricke

• Aspirational Budgets.
• Kein Follow-up auf Regressions.
• Per-PR-Varianz.
• Lab-only Testing.
• Third-party vergessen.
• Page-Level only.
• Kein Budget für neue Pages.

Performance-Budget vs SLI/SLO

FAQ: Performance-Budget

Was ist ein gutes Starter-Budget?

LCP < 2.5s, JS < 200KB gzipped, Lighthouse Perf ≥ 90.

Wie unterscheidet sich das von Core Web Vitals?

CWV sind die Metrics. Performance-Budget = das Commitment des Teams.

Kann ich per Page budgeten?

Ja. Lighthouse CI supportet per-URL Budgets.

Sollte ich auf Lab oder Field-Data budgeten?

Beide.

Was wenn PR Budget exceedet aber for good reason?

Bewusst Budget raisen oder optimieren.

Wie oft sollte ich Budgets reviewen?

Quartalsweise.

Brauchen SPAs verschiedene Budgets?

Ja — bigger JS-Bundles allowed, aber TTI/INP kritisch.

Enforce Performance-Budget mit LoadFocus

LoadFocus läuft Lighthouse-Audits aus 25+ Regionen on Schedule. Registrieren bei loadfocus.com/signup.