Interview Q&A / React
React interview questions
Rendering, state, hooks, keys and effects, explained with small examples.
Prefer rapid revision? Practise React short interview answers →
- What is the difference between useMemo and useCallback, and when should you not use them?
useMemo caches the result of a calculation, and useCallback caches a function itself, both until their dependencies change. Use them for expensive calculations or to keep values stable for memoized children or effect dependencies; skip them for cheap work, where they only add complexity.
IntermediateIn-depth3 min read - When should you use useEffect, and when should you avoid it?
Use useEffect to sync your component with something outside React, such as a network request, a subscription or a browser API. Avoid it for work you can do during rendering or inside an event handler.
IntermediateIn-depth2 min read - What are the rules of hooks, and why do they exist?
Call hooks only at the top level of a component or custom hook, never inside loops, conditions or nested functions, and only from React functions. React tracks hooks by call order, so the order must be the same every render.
BeginnerQuick answer1 min read - What is a custom hook, and why would you write one?
A custom hook is a function whose name starts with use and that calls other hooks. It lets you reuse stateful logic across components. Each component that calls it gets its own separate state.
BeginnerQuick answer1 min read - What is the difference between function components and class components, and which should you use today?
Function components are plain functions that use hooks for state and lifecycle behaviour. Class components use this.state and lifecycle methods. New code should use function components; classes still work, and error boundaries still need a class.
BeginnerQuick answer1 min read - What is the useId hook for, and why not use Math.random for IDs?
useId generates a stable unique ID that matches between server and client renders. It is meant for linking labels to inputs and aria attributes. Math.random changes each render and differs on the server, causing hydration mismatches.
IntermediateQuick answer1 min read