server-components-design

What problem does it solve?

Server Components design prevents broken or inefficient React trees by clarifying what belongs on the server versus the client, and by enforcing the serialization and streaming constraints that make RSC work.

Core Features & Use Cases

• Boundary discipline: Decide where interactivity starts so you avoid unnecessary 'use client' and minimize bundle size.
• Correct capability usage: Use Server Components for async work, server-only imports, and direct read-path data access, while reserving hooks, effects, and browser APIs for Client Components.
• Suspense streaming design: Place Suspense boundaries near slow data and structure siblings so independent queries stream in parallel.
• Data flow without extra APIs: Move read-path data directly into the rendered output instead of adding redundant JSON API routes.

Quick Start

Ask the agent to review your Next.js App Router component tree and tell you which files should be Server versus Client Components, where Suspense boundaries should be placed, and whether your current design violates RSC import/serialization rules.