What is the reconciliation algorithm and Fiber?
Why Interviewers Ask This
This is a classic screening question for React.js roles. Hiring managers ask it early in interviews to gauge your baseline understanding and determine if you can communicate technical concepts clearly.
Answer
React Fiber is the complete rewrite of React's reconciliation engine, introduced in React 16. The original Stack reconciler processed the entire component tree synchronously in one pass — if it started, it could not be interrupted. This caused jank for large trees because JavaScript is single-threaded and a long synchronous task blocks the browser from handling user input or animations. Fiber's key innovation: incremental rendering. It breaks rendering work into small units called fibers (one per component) that can be paused, resumed, prioritized, and discarded. This enables: (1) Prioritized updates — user interactions are higher priority than background data fetches. (2) Concurrent rendering (React 18) — React can work on multiple versions of the UI at once, interrupting low-priority work for high-priority updates. (3) Time-slicing — React yields control back to the browser between fiber units to keep the UI responsive. (4) Suspense — pause rendering waiting for data. The Fiber tree mirrors the component tree and stores all the information needed to perform, pause, or retry work.
Pro Tip
If you're unsure about a detail, say so honestly and explain your reasoning. Interviewers respect candidates who can think through uncertainty rather than bluffing.
Previous
What is the difference between React.Component and React.PureComponent?
Next
What is the difference between defaultProps and default parameter values?