Performance Budget Guardian

Goal

Achieve sub-second load times and optimal Core Web Vitals scores

How to Run

Provide your application codebase and performance budget targets. The agent will automatically optimize assets, streamline delivery, and eliminate performance bottlenecks until all metrics meet the defined budget.

1. 01

   Setup Environment

   Ensure you have Node.js installed along with Lighthouse CLI and required dependencies for performance auditing

2. 02

   Provide Codebase & Budget

   Share your application files and specify target performance metrics or let the agent use standard web vitals thresholds

3. 03

   Initiate Optimization Loop

   Run the loop and allow the agent to perform iterative optimizations while monitoring performance audits after each change

Workflow Steps

1. 01

   Analyze current performance baseline using Lighthouse audit

   Tool: lighthouse-cli · Input: static HTML/CSS/JS files or live URL · Output: performance-report.json

2. 02

   Identify top 3 performance bottlenecks based on audit results

   Tool: node-analyzer · Input: performance-report.json · Output: bottleneck-list.md

3. 03

   Apply targeted optimizations (e.g., lazy loading, minification, critical CSS)

   Tool: code-modifier · Input: bottleneck-list.md + source files · Output: optimized-code/*

4. 04

   Re-run performance audit to validate improvements

   Tool: lighthouse-cli · Input: optimized-code/ · Output: updated-performance-report.json

5. 05

   Evaluate if exit conditions are met; if not, return to step 2

   Tool: condition-checker · Input: updated-performance-report.json + budget targets · Output: proceed-flag

Start the "Performance Budget Guardian" loop.

Goal: Achieve sub-second load times and optimal Core Web Vitals scores
Max iterations: 10
Between iterations run: lighthouse --view --output=json --output-path=./lighthouse-report.json && node analyze-lighthouse.js
Exit when: All performance metrics within budget thresholds (Load Time < 1000ms, FCP < 1000ms, LCP < 2500ms, CLS < 0.1)


I want to optimize my application to meet a performance budget. Here's my codebase: [INSERT CODEBASE]. My target metrics are: [INSERT TARGETS]. Please begin optimizing by identifying bottlenecks, applying fixes, and re-auditing until performance goals are reached.

Self-pace this loop. After each iteration, run `lighthouse --view --output=json --output-path=./lighthouse-report.json && node analyze-lighthouse.js` and evaluate the output, and only continue if the exit condition is not met (All performance metrics within budget thresholds (Load Time < 1000ms, FCP < 1000ms, LCP < 2500ms, CLS < 0.1)). Stop when the exit condition passes or 10 iterations are reached. Give a short status update each pass.