perf-audit

Performance Audit

Analyzes application performance across bundle size, rendering, API response times, and database queries. Provides actionable optimization recommendations.

---

Execution Flow

Step 1: Detect Application Type

# Frontend frameworks
[ -f "next.config.js" ] || [ -f "next.config.mjs" ] || [ -f "next.config.ts" ] && echo "NEXTJS"
[ -f "vite.config.ts" ] || [ -f "vite.config.js" ] && echo "VITE"
[ -f "webpack.config.js" ] && echo "WEBPACK"

# Backend frameworks
[ -f "package.json" ] && grep -qE '"(express|fastify|koa)"' package.json && echo "NODE_API"
[ -f "requirements.txt" ] && grep -qE "(fastapi|django|flask)" requirements.txt && echo "PYTHON_API"
[ -f "go.mod" ] && echo "GO_API"

# Database
[ -d "prisma" ] && echo "PRISMA"
[ -f "drizzle.config.ts" ] && echo "DRIZZLE"
[ -f "alembic.ini" ] && echo "ALEMBIC"

---

Step 2: Run Audits by Focus

Focus: {{focus}} (default: all)

bundle - Bundle Size Analysis

# Next.js
ANALYZE=true npm run build 2>/dev/null

# Vite
npx vite-bundle-visualizer 2>/dev/null

# Check raw sizes
du -sh .next/ dist/ build/ 2>/dev/null
ls -lhS .next/static/chunks/*.js 2>/dev/null | head -20

Analyze source code for bundle bloat:

• Search for large library imports that could be tree-shaken
• Find full-library imports that should be specific named imports
• Identify duplicate dependencies in lock file
• Check for unneeded polyfills

Bundle Analysis
---------------
Total bundle:     542 KB (gzipped)
Target:           < 200 KB

Largest chunks:
  vendor.js        312 KB  (lodash: 72KB, moment: 67KB, chart.js: 45KB)
  main.js          128 KB
  pages/dashboard  102 KB

Optimization opportunities:
  1. Replace moment.js (67KB) with date-fns (12KB)      -> Save 55KB
  2. Import specific lodash functions                     -> Save ~60KB
  3. Lazy-load chart.js (only used on dashboard)          -> Save 45KB initial
  4. Enable tree-shaking for UI library                   -> Save ~30KB

  Estimated savings: ~190KB (35% reduction)