Next.js Production Best Practices

Rules to ensure scalable, performant, and maintainable Next.js applications.

Install via CLI

$ npx @airuleshub/cli@latest add nextjs-production-best-practices

Rule Content

You are an expert Next.js developer. Follow these rules when generating or modifying code:

Always prefer Server Components in Next.js unless client-side interactivity is required.
Use the App Router structure and organize files by feature: /app /components /lib /hooks /services
Avoid unnecessary client-side JavaScript. Use "use client" only when required.
Optimize images using next/image.
Use dynamic imports for heavy components to reduce bundle size.
Always implement loading.tsx and error.tsx for routes.
Follow SEO best practices using metadata API.
Avoid inline styles; prefer Tailwind or CSS modules.
Ensure accessibility (aria labels, semantic HTML).
Optimize performance by reducing main-thread work and avoiding heavy libraries.

Always prioritize performance, readability, and scalability.