Performance Profiler

Command

/perf-check

Description

Performs a comprehensive performance audit of your application. Analyzes bundle size, identifies slow code patterns, checks for memory leaks, reviews database queries, and produces a prioritized optimization report. Works with JavaScript/TypeScript (Node.js and frontend), Python, and Go applications.

Behavior

1. Bundle Analysis (frontend):

   • Analyze bundle size and tree-shaking effectiveness
   • Identify large dependencies and suggest lighter alternatives
   • Check for duplicate packages and unnecessary polyfills
   • Verify code splitting and lazy loading

2. Code Pattern Analysis:

   • Detect N+1 query patterns in ORM usage
   • Find synchronous operations that should be async
   • Identify missing indexes based on query patterns
   • Spot memory leak patterns (event listeners, closures, global state)
   • Check for unnecessary re-renders in React components

3. Runtime Profiling (if dev server available):

   • Measure API endpoint response times
   • Profile memory usage under load
   • Identify slow middleware in the request pipeline

4. Report Generation:

   • Prioritized findings by estimated impact
   • Specific code locations with before/after examples
   • Effort estimate for each fix

Output Format

Copy
# Performance Audit Report

## Summary
| Category | Issues Found | Critical | Quick Wins |
|----------|-------------|----------|------------|
| Bundle Size | 4 | 1 | 2 |
| Database | 3 | 2 | 1 |
| React Rendering | 5 | 0 | 3 |
| Memory | 1 | 1 | 0 |

## Critical Issues

### 1. N+1 Query in UserListPage (Impact: HIGH)
**File:** `src/pages/UserList.tsx:45`
**Problem:** Loading 100 users triggers 100 individual role queries
**Fix:**
```typescript
// Before: N+1 queries
const users = await db.user.findMany();
for (const user of users) {
  user.roles = await db.role.findMany({ where: { userId: user.id } });
}

// After: Single query with join
const users = await db.user.findMany({
  include: { roles: true },
});

Effort: 15 minutes | Impact: ~95% reduction in DB queries for this page

2. Moment.js in Bundle (Impact: MEDIUM)

File: package.json Problem: moment.js adds 290KB to bundle (67KB gzipped) Fix: Replace with date-fns (tree-shakeable, import only what you use) Effort: 1-2 hours | Impact: ~60KB reduction in gzipped bundle

Quick Wins

• Add React.memo to UserCard component (re-renders 47x on list page)
• Add loading="lazy" to below-fold images on homepage
• Enable gzip/brotli compression in Express middleware

## Examples

/perf-check # Full audit /perf-check --bundle-only # Just bundle analysis /perf-check --database # Just database query analysis /perf-check --file src/pages/Home # Analyze specific file/directory /perf-check --react # React-specific rendering analysis