Comprehensive React interview prep covering components, hooks, state management, lifecycle methods, context, and more. Questions asked at Razorpay, Flipkart, Google, Atlassian, Swiggy, CRED and other top tech companies.
React is a JavaScript library for building user interfaces using a component-based architecture. It allows developers to create reusable UI components and efficiently update the DOM using a Virtual DOM.
The Virtual DOM is a lightweight JavaScript representation of the real DOM. React uses it to compare previous and current UI states and update only the changed parts in the real DOM for better performance.
A re-render is triggered when state changes, props change, or context updates. A parent re-render can also cause child components to re-render unless optimizations like React.memo are used.
Reconciliation is the process of comparing the old Virtual DOM with the new one to determine what has changed. React uses an optimized diffing algorithm to update only the necessary parts of the DOM.
useEffect runs asynchronously after the browser paints, making it suitable for side effects like API calls. useLayoutEffect runs synchronously after DOM updates but before paint, useful for measuring layout or synchronizing UI changes.
Controlled components manage form input values through React state, while uncontrolled components store their own state in the DOM and are accessed using refs. Controlled components provide better control and validation.
React.memo is a higher-order component that prevents unnecessary re-renders by memoizing a component. It performs a shallow comparison of props and skips rendering if props have not changed.
Keys are unique identifiers used in lists to help React track elements during reconciliation. Stable keys allow React to update only changed items, improving performance and preventing UI bugs.
Batching is the process of grouping multiple state updates into a single render for performance optimization. React automatically batches updates in event handlers and async operations in modern versions.
React Fiber is the internal reconciliation engine introduced in React 16. It enables interruptible rendering, prioritization of updates, and smoother UI by breaking work into smaller units.
Focus on why React behaves the way it does — rendering patterns, state management, hooks behavior. Interviewers can tell the difference.
Use output quiz questions to train your mental model. If you can predict what code logs, you truly understand the concept.
Practice with buggy code that produces wrong output silently — not syntax errors. Real interview bugs are always logical, not typos.
Async & Effects, Component Logic, Event Loop & Batching, async/await and features cover 90% of React interviews.
Use the Sprint feature — 10 questions in 15 minutes. Interview pressure is real and you can train for it.
Interactive questions with instant feedback. Predict outputs, find bugs, and master React.