linkedinlogo
React
React

What are React Server Components (RSCs), and how do they reduce client bundle size?

March 19, 2026

React Server Components render entirely on the server, sending static HTML instead of JavaScript bundles, cutting client payload by 80-90% for data-heavy UIs. Mark with 'use server' directive—data fetching happens server-side, no client hydration needed for static content. Client Components ('use client') handle interactivity only.

Example:-

Code

// Server Component - no JS shipped to client
async function UserList() {
  const users = await db.users.findMany();
  return (
    <ul>
      {users.map(user => (
        <li key={user.id}>{user.name}</li>
      ))}
    </ul>
  );
}

// Client Component - JS only where needed
'use client';
function LikeButton({ postId }) {
  const [liked, setLiked] = useState(false);
  return <button onClick={() => setLiked(!liked)}>Like</button>;
      
Company Deck
PDF, 3MB

© 2026 Zignuts Technolab. All Rights Reserved.