React Server Components

Definition

Composants qui s'executent uniquement sur le serveur, avec acces direct aux bases de donnees et fichiers. Leur code n'est pas envoye au client, reduisant le bundle JS.

Analogie

Comme la cuisine d'un restaurant : le client ne voit que le plat (HTML), pas les ustensiles (code serveur).

Exemple de code

// Server Component (par defaut dans Next.js App Router)
export default async function UserList() {
  const users = await db.query('SELECT * FROM users');
  return (
    <ul>
      {users.map(u => <li key={u.id}>{u.name}</li>)}
    </ul>
  );
}

Cas d'usage

Composants qui affichent des donnees sans interactivite : listes, articles, dashboards de lecture.

Anti-pattern

Termes lies