Next.js Performance Audit

0•

Audits Next.js applications for bundle bloat, React Server Component boundaries, image optimization, and Core Web Vitals.

The Next.js Performance Audit skill provides automated, read-only analysis of Next.js codebases to uncover performance bottlenecks across both App and Pages routers. It inspects client and server component splits, identifies oversized dependencies and non-optimized assets, and delivers prioritized recommendations for Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), and Interaction to Next Paint (INP). Ideal for sprint planning or pre-launch reviews, this skill helps engineering teams ship faster web experiences with verifiable, repo-grounded optimization tasks.

主な機能

01Bundle size analysis detecting heavy client-side imports and bundle analyzer setup
02React Server Component (RSC) boundary validation to reduce unnecessary client islands
03Image and font checks assessing next/image, next/font, and layout shift risks
040 GitHub stars
05Prioritized output grouping findings by high, medium, and low impact with quick wins
06Core Web Vitals checklist targeting actionable fixes for LCP, CLS, and INP

ユースケース

01Auditing Next.js frontend routes prior to production releases to avoid performance regressions
02Identifying client component bloat and converting unnecessary client islands back to Server Components
03Generating an actionable sprint backlog of quick wins to improve Core Web Vitals metrics