Performance Skill

Systematic approach to identify và resolve performance bottlenecks.

When to Use

• Slow page loads / response times
• High memory consumption
• Database query optimization
• Bundle size reduction
• Runtime performance issues
• Scalability concerns

Stack-Specific Guidelines

Next.js / React

• Use React DevTools Profiler
• Implement lazy loading (React.lazy, next/dynamic)
• Optimize images (next/image)
• Minimize re-renders với useMemo, useCallback
• Server Components vs Client Components

Node.js

• Profile với --inspect flag
• Use async/await properly (avoid blocking)
• Connection pooling for databases
• Implement caching (Redis, in-memory)
• Monitor event loop lag

React Native

• Use FlatList thay ScrollView cho lists
• Memoize components với React.memo
• Optimize images (compressed, cached)
• Avoid inline styles trong render
• Use Hermes engine

Python

• Profile với cProfile, line_profiler
• Use appropriate data structures
• Async với asyncio
• Database query optimization
• Caching strategies

Process

1. Measure First

• Identify baselines
• Use profiling tools
• Log performance metrics

2. Identify Bottlenecks

• CPU-bound vs I/O-bound
• Memory leaks
• Network latency
• Database queries

3. Optimize

• Apply targeted fixes
• One change at a time
• Re-measure after each change

4. Validate

• A/B comparison
• Load testing
• Real-world benchmarks

Performance Checklist

## Performance Review

### Frontend
- [ ] Bundle size < 200KB (gzipped)?
- [ ] Images optimized (WebP, lazy)?
- [ ] Code splitting implemented?
- [ ] No unnecessary re-renders?

### Backend
- [ ] API response < 200ms?
- [ ] Database queries indexed?
- [ ] N+1 queries eliminated?
- [ ] Caching implemented?

### General
- [ ] No memory leaks?
- [ ] Proper async handling?
- [ ] CDN for static assets?

Report Format

# Performance: [Component/Feature]

## Metrics Before
- Load time: Xs
- Bundle size: XKB

## Bottlenecks Found
1. Issue 1
2. Issue 2

## Optimizations Applied
1. Fix 1 → Result
2. Fix 2 → Result

## Metrics After
- Load time: Ys
- Bundle size: YKB

## Improvement
X% faster / X% smaller