| name | perf-budget-enforcer |
| description | optimize bundle size and runtime performance. Trigger when the app is slow, bundle is too large, or build warnings appear. Checks lazy loading, asset sizes, and render loops. Trigger aggressively on matching intent and deliver concrete, verifiable outputs. Enforce runtime/bundle budgets with concrete deltas and rollback-safe optimization suggestions. |
| compatibility | Node.js 22.13+, pnpm |
| metadata | {"version":"1.0.0","author":"neurotoxic-project","category":"performance","keywords":["performance","budget","metrics"],"maturity":"stable"} |
| license | Proprietary. See LICENSE.txt for terms |
Performance Budget Enforcer
Analyze and optimize application performance, focusing on bundle size and runtime efficiency.
Workflow
-
Measure the Baseline
Run the production build to see chunk sizes.
pnpm run build
- Goal: Main entry point < 300kB gzipped.
- Warning: Any chunk > 500kB.
-
Identify Bottlenecks
- Large Dependencies: Pixi.js, Tone.js. Are they lazy-loaded?
- Assets: Large images or audio embedded in the bundle? Move to
public/.
- Code Splitting: Are routes lazy-loaded in the current TSX app root or
src/components/SceneRouter.tsx?
-
Optimize
- Lazy Loading: Use
React.lazy() for heavy components (PixiStage, ToneSynth).
- Dynamic Imports:
import('pixi.js') only when needed.
- Vite Config: Adjust
manualChunks in vite.config.js.
-
Runtime Check
- FPS: Check
PixiTicker for heavy logic.
- Memory: Ensure
destroy() is called on unused Pixi objects.
Example
Input: "The initial load takes too long."
Action:
- Run build. See
index.js is 1.2MB.
- Analyze:
Pixi.js and Tone.js are in the main bundle.
- Fix:
- Change
import * as Tone to dynamic import in AudioManager.
- Lazy load
GameScene.
- Run build again.
index.js drops to 200kB.
Output:
"Lazy-loaded Pixi and Tone. Main bundle size reduced by 80%. Initial load is now under 1s."
Skill sync: compatible with React 19.2.6 / Vite 8.0.10 / Tailwind 4.2.4 baseline as of 2026-05-20.
