Top 75 React Interview Questions You Should Know

Why React interviews test depth, not trivia

React interviews in 2026 go far beyond 'what is JSX.' Interviewers want to see that you understand rendering, state boundaries, performance trade-offs, and how React fits into a larger frontend architecture.

Use this list as a spoken-answer checklist. For each question, practice a 60-second answer, then a 3-minute deep dive with a real project example.

React fundamentals (15 questions)

These appear in almost every frontend screen:

• What is React and what problem does it solve?
• Explain the virtual DOM and reconciliation.
• What is JSX? How does it compile?
• Class components vs function components — when would you still use classes?
• What are props? How is data passed between components?
• What is state? How does setState / useState trigger re-renders?
• Controlled vs uncontrolled components — give examples.
• Why do we need keys in lists? What happens if you use index as key?
• What is lifting state up?
• One-way data flow — why does React enforce it?
• What is a React element vs a React component?
• How do you conditionally render in React?
• What are React fragments and why use them?
• How do you handle forms in React?
• What is the difference between element and component in the reconciliation tree?

Hooks deep dive (20 questions)

Hooks are the core of modern React interviews:

• What are React Hooks and why were they introduced?
• Rules of Hooks — explain each rule and why it exists.
• useState — how does batching affect multiple setState calls?
• useEffect — explain the dependency array and cleanup function.
• What is a stale closure in useEffect and how do you fix it?
• useRef vs useState — when to use each?
• useMemo — what does it cache and what are its costs?
• useCallback — when does it actually help performance?
• useContext — how do you avoid unnecessary re-renders?
• useReducer vs useState — when to prefer useReducer?
• How do you build a custom hook? Give an example (useFetch, useDebounce).
• useLayoutEffect vs useEffect — when to use each?
• useImperativeHandle — what problem does it solve?
• useId — why is it needed for accessibility?
• How do you share logic between components without HOCs or render props?
• What happens if you call Hooks inside conditions or loops?
• How does React track which state belongs to which Hook call?
• Can you use multiple useEffect hooks in one component? Best practices?
• How do you test components that use custom hooks?
• What are the pitfalls of overusing useMemo and useCallback?

Rendering and lifecycle (10 questions)

Understand when and why components re-render:

• What triggers a re-render in React?
• React 18 automatic batching — what changed?
• What is React.memo and when should you use it?
• How does the legacy class component lifecycle map to hooks?
• What is StrictMode and what does it double-invoke?
• Error boundaries — why can't they be function components (without react-error-boundary)?
• How do you prevent a child from re-rendering when parent state changes?
• What is render prop pattern? Compare with custom hooks.
• Higher-Order Components (HOCs) — pros, cons, and modern alternatives.
• What is hydration and when does hydration mismatch occur?

State management and architecture (10 questions)

Mid-to-senior roles expect architectural clarity:

• Local state vs global state — how do you decide?
• Context API vs Redux/Zustand/Jotai — trade-offs?
• How do you structure state in a medium-sized React app?
• What is prop drilling and how do you solve it?
• Server state vs client state — what belongs where?
• How does React Query / TanStack Query fit into a React architecture?
• What is the flux pattern and how does Redux implement it?
• How do you handle form state at scale (React Hook Form, Formik)?
• What is colocation of state and why does it matter?
• How do you manage side effects in a Redux application (thunks, sagas, RTK Query)?

Performance optimization (10 questions)

Senior interviews probe whether you optimize with evidence, not instinct:

• How do you identify performance bottlenecks in a React app?
• What is code splitting and how do you implement it (React.lazy, Suspense)?
• Virtualization for long lists — when and how (react-window, react-virtualized)?
• What is the difference between deferring render and deferring value (useDeferredValue)?
• useTransition — what does it mark as non-urgent?
• How do you avoid unnecessary context re-renders?
• Bundle size optimization strategies for React apps.
• What is tree shaking and how does it affect React imports?
• How do you profile React performance (React DevTools Profiler)?
• What are common causes of slow initial page load in React SPAs?

React 18+ and modern patterns (10 questions)

Stay current — interviewers expect awareness of the modern React model:

• What is Concurrent React and what problems does it solve?
• Suspense for data fetching — how does it work conceptually?
• Server Components vs Client Components (Next.js App Router context).
• What is the 'use client' directive and when is it required?
• How do Server Actions fit into form handling?
• Streaming SSR — what is the user experience benefit?
• React Compiler (React Forget) — what does it automate?
• How do you handle SEO in a React application?
• Micro-frontends with React — common integration patterns.
• How do you migrate a large class-component codebase to hooks?

How to practice

Group questions by theme and do 15 per day. Record yourself answering aloud, then run AI mock interviews on InterviewVeda to practice follow-up questions like 'optimize this component' or 'design a dashboard with these constraints.'