Full Stack Developer Interview Question

What actually causes a React component to re-render, and why is that not the same as a DOM update?

What the interviewer is probing, how to structure your answer, and a spoken example you can adapt.

Quick answer

A component re-renders when its own state changes, when a context it consumes publishes a new value, or when its parent re-renders and produces a new element for it. Rendering just calls the function and produces a description of the UI. React then diffs that against the previous tree and commits only the DOM changes that differ, so most re-renders touch no DOM at all.

Why interviewers ask this

Plenty of candidates reach for useMemo and useCallback reflexively without knowing what triggers work in the first place. The interviewer wants evidence that you can reason about the render and commit phases separately, that you measure before optimizing, and that you know memoization has a cost. It is also a quiet test of whether you have ever profiled a real React app or only read about performance.

How to structure your answer

  • List the three triggers for a render.
  • Separate the render phase from the commit phase.
  • Explain why a new object prop breaks memoization rather than forcing DOM work.
  • Say how you would measure before changing anything.

Example answer

Spoken example, first person

Three things trigger it: a state update in the component, a context value it subscribes to changing, or the parent re-rendering. That last one is where people get surprised, because a parent render re-runs every child function regardless of whether its props changed by value. But rendering only produces an element tree. React reconciles that against the previous tree and commits the minimal set of DOM mutations, so a re-render is often cheap and touches no DOM at all. The expensive cases are big subtrees and heavy computation inside the render body. When a page felt sluggish on a product I worked on, I opened the React DevTools profiler rather than guessing, and the culprit was a single context holding both the current user and a live search string, so every keystroke re-rendered the whole authenticated shell. Splitting that into two contexts fixed it in about ten lines. I only reach for memo once the profiler tells me a specific subtree is the problem.

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 works

Follow-up questions to expect

  • When does React.memo actually help, and when is it just overhead?
  • How does the key prop change reconciliation behavior?
  • What would you use instead of context for high frequency updates?

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

Rehearse the hard questions before they are asked

Practise with a live copilot, then walk in ready. A $29 Session Pass gets you through the interview with no subscription and no lock-in.

Get GhostPilot