React Architecture & "Under the Hood"

Question 1

React Server Components (RSC)

Answer 1

Definition: Components that execute only on the server, sending a serialized “payload” to the client instead of a full JS bundle.Key Concepts: Zero bundle size, direct database access, “Server-Only” logic.Evaluator Tip: In an evaluation, flag any component that fetches secret API keys on the client. These should be Server Components to ensure the secret never touches the browser.

Question 2

Hydration vs. Streaming

Answer 2

Definition: Hydration is the process of attaching event listeners to static HTML. Streaming allows React to send HTML chunks to the browser as they are ready.Key Concepts: Suspense is the orchestrator of streaming. It lets the shell of the app load while heavy components “stream” in later.Evaluator Tip: If a page has a “blocking” fetch that makes the whole screen white while loading, suggest wrapping the slow component in Suspense to enable streaming.

Question 3

The React Compiler (Forget)

Answer 3

Definition: A build-time tool that automatically memoizes components, props, and hooks, theoretically removing the need for manual useMemo or useCallback.Key Concept: Automatic dependency tracking.Evaluator Tip: While the compiler handles much of the work, senior evaluators still look for stable object references and proper component structure, as the compiler can’t “fix” fundamentally broken logic (like unstable keys).

Question 4

Partial Pre-rendering (PPR)

Answer 4

Definition: A performance feature where the static parts of a page are pre-rendered into a “shell” (prelude), while dynamic holes are filled in asynchronously.Use Case: An E-commerce page where the layout is static but the “User Profile” or “Cart” is dynamic.Evaluator Tip: This is the peak of 2026 web performance. Look for usage of Suspense boundaries to define where these “dynamic holes” exist.