nextjs-patterns

Parallelize independent fetches with Promise.all or Promise.allSettled instead of awaiting sequentially. Use the preload pattern to fire fetches early, and wrap distinct data-loading subtrees in Suspense boundaries so they stream independently.

Use Server Components by default for data fetching, secret-bearing dependencies, and non-interactive content. Add 'use client' only at the smallest interactive leaves needing event handlers, browser APIs, or hooks, and pass Server Components as children to avoid promoting subtrees.

No, middleware is not a security boundary, as shown by CVE-2025-29927 which allowed bypassing middleware authorization. Verify auth in the Data Access Layer and re-check authorization inside every Server Action and Route Handler.

In Next.js v15 and later, fetch is uncached by default, unlike v14. Opt in with cache: 'force-cache' or next: { revalidate: seconds }, or use v16 Cache Components with the 'use cache' directive, cacheLife(), and cacheTag().

Vercel offers zero-config ISR, image optimization, and version skew protection but costs grow above roughly 10M requests per month. Self-hosting with output: 'standalone' gives predictable costs but requires managing cache handlers, sharp, proxy buffering, and encryption keys.

Validate every Server Action input with Zod using safeParse, since Server Actions compile to public POST endpoints. The next-safe-action library adds composable middleware for auth and rate limiting plus typed hooks like useAction.