Why does a component re-render, and is re-rendering always bad?
Model answer
A component re-renders when its state changes, when its parent re-renders, or when a context it reads changes. Re-rendering is normal and often cheap. It becomes a problem only when it is slow or visibly laggy.
Measure with the React DevTools Profiler before optimising.
Learn this topic
React Performance: memo, useMemo, useCallback and When Not to Use Them in the course React.js Full Course: Beginner to Advanced.
Sign in to add your own answer.
More questions
- What does React.memo do?
- What is the difference between useMemo and useCallback?
- What is the React Compiler, and does it replace useMemo and useCallback?
- How do you lazy-load components in React?
- How do you render a very long list efficiently?
- Why can inline objects and functions as props hurt memoisation?