Every new Next.js 15 route we build starts as a Server Component, and we only reach for "use client" once something genuinely needs the browser: state, effects, or an event handler.

Why this default pays off

Server Components ship zero JavaScript to the browser for the parts of a page that don't need it. On a marketing page, that's often most of the page — headings, copy, and images render as plain HTML.

A concrete example

A pricing table's copy and layout can stay server-rendered; only the currency toggle, if one exists, needs to be a small client island around it.

// Server Component — no "use client" needed
export function PricingCard({ tier }: { tier: Tier }) {
  return (
    <div>
      <h3>{tier.name}</h3>
      <p>{tier.price}</p>
    </div>
  );
}

Where we still reach for client components

Anything with autoplay, drag interactions, form state, or scroll-based animation. The goal isn't "zero client components" — it's not paying the client-JS cost for content that never needed it.

#Next.js

#Next.js