What is React Concurrent Mode?
Why Interviewers Ask This
Mid-level React.js roles require deep understanding of this topic. Interviewers ask this to separate candidates who truly understand the mechanics from those who only know surface-level concepts.
Answer
Concurrent Mode (React 18, enabled by createRoot) is a set of new capabilities that allow React to interrupt rendering work and prioritize more important updates. In legacy mode, rendering was synchronous and uninterruptible — once started, it had to finish. In Concurrent Mode, React can: (1) Interrupt a low-priority render to handle a high-priority update (like user input). (2) Abandon work that is no longer needed (e.g., if the user navigates away). (3) Reuse previously computed work. (4) Prepare multiple UI states simultaneously. Enabling: ReactDOM.createRoot(document.getElementById("root")).render(<App />); — all React 18 apps should use createRoot. New features enabled by Concurrent Mode: useTransition, useDeferredValue, Suspense for data fetching, automatic batching, streaming SSR. Important: components must be pure (no side effects during render) for concurrent rendering to work correctly — the render function may be called multiple times. This is why Strict Mode double-invokes renders — to surface purity violations.
Pro Tip
Demonstrate both theoretical understanding and practical experience. Say what it is, then give an example of how you actually used it in a React.js codebase.