Server Components run only on the server, ship no JavaScript to the browser, and can await data directly, which removes most fetch plus useEffect plus loading state plumbing. Client Components, marked with use client, still own interactivity, state and browser APIs. You push data fetching up into server components and keep client components as small leaves, which shrinks the bundle and moves the data waterfall server side.
Why interviewers ask this
This is the biggest change in React in years, so the interviewer is checking that you have kept current and can articulate a boundary rather than repeating marketing copy. They want to hear that you understand what crosses the serialization boundary, where state can and cannot live, and what the tradeoffs are. Vague enthusiasm reads badly here; a candidate who names a real constraint reads as someone who has shipped it.
How to structure your answer
- Define the two component types in one sentence each.
- Explain what can and cannot cross the boundary.
- Describe the resulting component tree shape.
- Name one concrete tradeoff you have hit.
Example answer
The mental model that clicked for me is that the boundary is a serialization boundary, not a folder. Server Components render on the server and their code never reaches the browser, so a heavy markdown or date library used there costs zero kilobytes on the client. They can await a database call directly in the component body. Anything with state, effects, or an event handler has to be a Client Component with use client at the top, and props crossing into it must be serializable, so you pass data rather than functions or class instances. In practice that means my trees look like server components all the way down with small interactive leaves, and I pass server fetched data in as props. The tradeoff I hit on a recent project was mental overhead in code review, because people kept adding use client to a parent for one small button and quietly pulling a whole subtree onto the client. We ended up adding a lint rule and a bundle size check in CI to catch that.
Walking into this interview soon? GhostPilot listens to your live call, spots the question the moment it is asked, and puts a structured answer on your screen in real time. Try it on your next mock, or grab a $29 Session Pass, no subscription, for the real thing.
See how it worksFollow-up questions to expect
- Where does the use hook fit into this?
- How do you handle a form that needs a server round trip?
- How would you cache data fetched inside a server component?
Related full stack developer questions
Your interviewer will ask their own version of this. Paste your actual job description into the free Question Predictor and get the 20 questions that role is most likely to ask, with what each one is really probing.
Predict my questions