What is React Server Components (RSC)?

React Server Components fundamentally change how web applications are built. In traditional React, every component is a client component: the browser downloads the JavaScript, executes it, and renders the UI. This means large JavaScript bundles, slow initial loads, and exposed API endpoints. With RSC (the default in Next.js App Router), components execute on the server during the request. The server runs the component code, resolves all data fetching (including direct database queries), and sends the finished HTML to the browser, with zero JavaScript payload for that component. The implications are profound. Security: you can query PostgreSQL directly in a component with `await db.query()` and the database credentials never leave the server. Performance: a page with 15 Server Components might ship only 2KB of JavaScript (for the few interactive elements) instead of 200KB. SEO: search engines receive complete, rendered HTML on the first request, no client-side rendering delays. The architecture uses a clear boundary: Server Components handle data fetching, business logic, and static rendering. Client Components (marked with "use client") handle interactivity, click handlers, form state, animations. The two can be freely composed: a Server Component can render a Client Component as a child, passing server-fetched data as props.