These are common questions that appear in frontend interviews.

They are not just for interview prep but represent core knowledge every frontend developer should understand.

Question 1. What is the relationship between SSR and Hydration?

SSR (Server-Side Rendering)

• Server executes React components and sends fully rendered HTML.
• HTML is static: no event handlers or state logic.

Hydration (Client-Side Work)

• Browser downloads JS bundle.
• React attaches event handlers and state to pre-rendered HTML.
• Example: <button> rendered on server, but onClick only connects during hydration.

Why Hydration?

• SSR provides visible page but only a static shell.
• React must sync Virtual DOM with real DOM and attach logic → hydration.

Question 2. What is Tree Shaking, and what are its requirements?

Definition

• Tree Shaking = remove unused (dead) code from final bundle.
• Optimizes size and performance.

How it Works