/perf

1# /perf Command
2
3## Description
4Profile application performance across multiple dimensions.
5
6## Analysis Areas
7
8### 1. Bundle Analysis
9```bash
10# Build with analysis
11ANALYZE=true next build
12
13# Or standalone
14npx @next/bundle-analyzer
15```
16
17Output:
18- Total bundle size (JS + CSS)
19- Per-page breakdown
20- Largest dependencies
21- Tree-shaking effectiveness
22
23### 2. Lighthouse Audit
24```bash
25npx lighthouse http://localhost:3000 --output json --output html
26```
27
28Checks:
29- Performance score (target: >90)
30- First Contentful Paint (target: <1.8s)
31- Largest Contentful Paint (target: <2.5s)
32- Cumulative Layout Shift (target: <0.1)
33- Total Blocking Time (target: <200ms)
34
35### 3. Server Performance
36```bash
37# API response times
38curl -w "\nTotal: %{time_total}s\nTTFB: %{time_starttransfer}s\n" \
39  http://localhost:3000/api/health
40```
41
42### 4. Database Queries
43```sql
44-- Find slow queries
45SELECT query, mean_exec_time, calls
46FROM pg_stat_statements
47ORDER BY mean_exec_time DESC
48LIMIT 10;
49```
50
51### 5. Recommendations
52Common optimizations:
53- Dynamic imports for heavy components
54- Image optimization (next/image, WebP/AVIF)
55- Font subsetting and preloading
56- API response caching (Redis, CDN)
57- Database query optimization (indexes, connection pooling)
58
59## Usage
60- `/perf` - Run full performance audit
61- `/perf bundle` - Bundle analysis only
62- `/perf lighthouse` - Lighthouse audit only
63- `/perf db` - Database query analysis