React Interview Questions for Indian Companies 2026

Start with the conceptual questions every React interview opens with. The virtual DOM: React maintains a lightweight JavaScript representation of the real DOM. When state changes, React re-renders the component in the virtual DOM, diffs it against the previous virtual DOM snapshot, and applies only the minimal necessary changes to the real DOM: this is called reconciliation. Why this matters: direct DOM manipulation is slow; batching changes through the virtual DOM is much faster. JSX: syntactic sugar that compiles to React.createElement() calls. Every JSX element is a function call; this is why React must be in scope in older codebases. Components: class components (legacy, still appears in older codebases: know lifecycle methods: componentDidMount, componentDidUpdate, componentWillUnmount) vs functional components (current standard). Props flow down (parent to child), state is local to a component, and events flow up via callback props. This one-way data flow is a design principle, not a limitation.

Hooks are the most heavily tested React topic at Indian product companies in 2026. Know these cold: useState: manages local state in a functional component. The setter function can take a value or an updater function: always use the updater form when the new state depends on the old: setState(prev => prev + 1), not setState(state + 1) (the second form can be stale in async contexts). useEffect: handles side effects (API calls, subscriptions, timers). The dependency array controls when it runs: empty array = once on mount; no array = every render (usually a bug); specific values = when those values change. The cleanup function handles unmounting. Common interview question: 'Why does my useEffect cause an infinite loop?': because you are updating state inside useEffect without proper dependencies. useMemo: memoizes an expensive computed value, recalculating only when dependencies change. useCallback: memoizes a function reference, preventing child re-renders caused by new function instances. useRef: mutable value that persists across renders without triggering re-renders; also used to reference DOM elements directly. useContext: consumes a React context without passing props through intermediate components.

State management is tested at mid-senior level. The progression: local state (useState) → prop drilling → Context API → external state library. Context API: appropriate for low-frequency updates (theme, auth, locale). Not suitable for high-frequency updates (every keystroke) because all consumers re-render on every context change. Redux: state lives in a single store; components dispatch actions; reducers return new state. The key interview question: 'Why use Redux instead of Context?': Redux has better debugging (Redux DevTools, time-travel debugging), middleware support (redux-thunk, redux-saga for async), and better performance for high-frequency updates via selective subscription. Zustand: increasingly popular at Indian startups in 2026: simpler API than Redux, less boilerplate. React Query / TanStack Query: manages server state (API data) separately from client state; provides caching, background refetching, and loading/error states. The question 'What is the difference between server state and client state?' is increasingly common at product companies.

Performance questions signal senior-level thinking. Common questions: (1) 'How do you prevent unnecessary re-renders?': React.memo wraps a component and skips re-rendering if props haven't changed; useCallback and useMemo prevent new references causing downstream re-renders. (2) 'What is code splitting?': React.lazy() + Suspense splits the bundle so large components load only when needed. (3) 'What is the difference between useMemo and useCallback?': useMemo caches a value; useCallback caches a function. Both avoid expensive recalculations on every render. (4) 'How does React 18's concurrent rendering help performance?': concurrent mode allows React to interrupt, pause, and resume rendering, keeping the UI responsive during heavy work. useTransition marks state updates as non-urgent. (5) Virtualization: for long lists (thousands of items), use react-window or react-virtual: render only the visible portion of the list, not all items.

React 18 (released 2022, widely used in Indian products by 2024) introduced features increasingly tested at product companies: Automatic batching: React 18 batches all state updates (including inside setTimeout, Promises, and native event handlers) by default: previously only synchronous event handler updates were batched. useTransition: marks state updates as interruptible, allowing React to keep the UI responsive while processing. useDeferredValue: similar to useTransition but for deferring the rendering of a specific value. Suspense for data fetching: while previously limited to code splitting, Suspense in React 18 supports suspending while async data loads. Streaming SSR: server-side rendering can stream HTML in chunks, improving Time to First Byte. The most common interview question: 'What changed in React 18 and why?': automatic batching and concurrent rendering are the key answers.

Indian candidates most commonly fail React interviews on: (1) Not explaining WHY: knowing that useCallback prevents re-renders is not enough; explaining that it memoizes the function reference so child component's React.memo comparison passes is the answer. (2) State mutation: directly mutating state (this.state.array.push()) causes subtle bugs because React uses reference equality to detect changes. Always return new objects and arrays. (3) Stale closures: a useEffect that captures a value at creation time will use the stale value unless the value is in the dependency array. (4) Key prop misuse: using array index as key for lists that reorder causes UI bugs; keys must be stable, unique identifiers. (5) Over-fetching in useEffect: fetching on every render instead of once (missing dependency array), or fetching without cancellation on unmount causing memory leaks.