nextjs-performance

Comprehensive Next.js performance optimization covering Core Web Vitals, modern React patterns, and production-grade techniques. Expert guidance for optimizing Next.js applications with focus on Core Web Vitals, modern patterns, and best practices. This skill provides comprehensive guidance for optimizing Next.js applications. It covers Core Web Vitals optimization (LCP, INP, CLS), modern React patterns, Server Components, caching strategies, and bundle optimization techniques. Designed for developers already familiar with React/Next.js who want to implement production-grade optimizations. Use this skill when working on Next.js applications and need to: Load relevant reference files based on the area you're optimizing: Follow the quick patterns for common optimizations Apply before/after conversions to improve existing code Verify improvements with Lighthouse after changes BEFORE (Client Component with useEffect): AFTER (Server Component with direct data access): Load these references when working on specific areas: - Covers Core Web Vitals optimization (LCP, INP, CLS), image/font optimization with next/image and next/font , and caching strategies using unstable_cache and revalidateTag - Guides conversion of Client Components to Server Components, implementation of Suspense streaming for progressive loading, and bundle size reduction through code splitting - Includes Next.js...