performance-audit

📁 jamelna-apps/claude-dash 📅 7 days ago
3
总安装量
3
周安装量
#57960
全站排名
安装命令
npx skills add https://github.com/jamelna-apps/claude-dash --skill performance-audit

Agent 安装分布

gemini-cli 3
claude-code 3
codex 3
opencode 3
qoder 2
replit 2

Skill 文档

Performance Audit Framework

Initial Assessment Questions

  1. What’s slow? – Page load, API response, build time, runtime
  2. How slow? – Quantify: 3s vs 30s matters
  3. Baseline? – What’s acceptable performance?
  4. When? – Always slow, or under certain conditions?
  5. Where? – Client, server, network, database?

Measurement First

NEVER optimize without measuring. Identify bottlenecks before fixing.

Web Performance Metrics

  • LCP (Largest Contentful Paint) – Main content visible
  • FID (First Input Delay) – Interactivity
  • CLS (Cumulative Layout Shift) – Visual stability
  • TTFB (Time to First Byte) – Server response

Tools

  • Chrome DevTools Performance tab
  • Lighthouse audit
  • WebPageTest.org
  • React DevTools Profiler
  • console.time() / console.timeEnd()

Common Performance Issues

Frontend

Issue Detection Fix
Large bundle Webpack analyzer Code splitting, tree shaking
Render blocking Network waterfall Defer/async scripts, critical CSS
Excessive re-renders React Profiler useMemo, useCallback, React.memo
Memory leak Memory timeline Cleanup effects, remove listeners
Layout thrashing Performance timeline Batch DOM reads/writes

Backend/API

Issue Detection Fix
N+1 queries Query logs Eager loading, batching
Missing indexes EXPLAIN plans Add appropriate indexes
No caching Repeated queries Redis, in-memory cache
Sync blocking Flame graphs Async/await, worker threads
Large payloads Network tab Pagination, field selection

Database

Issue Detection Fix
Full table scan EXPLAIN Add index on filter columns
Too many indexes Write latency Remove unused indexes
Large result sets Memory usage Pagination, streaming
Lock contention Deadlock logs Optimize transactions

Quick Wins Checklist

Frontend:

  • Enable gzip/brotli compression
  • Set cache headers
  • Lazy load images and routes
  • Use production builds
  • Minimize third-party scripts

Backend:

  • Add database indexes for common queries
  • Implement response caching
  • Use connection pooling
  • Enable query result caching
  • Optimize N+1 queries

Performance Budget

Set limits and enforce:

  • Bundle size: < 200KB (gzipped)
  • API response: < 200ms (p95)
  • Page load: < 3s (LCP)
  • Build time: < 60s

Output Format

When reporting:

  1. Current State – Measured performance with numbers
  2. Bottlenecks – Identified issues ranked by impact
  3. Recommendations – Specific fixes with expected improvement
  4. Priority – Quick wins vs larger refactors