Wrapping Components with React.memo

Hands-on practice for this lecture. Work through the exercises and quizzes to reinforce what you've learned.

1

Exercise 1 of 1

Wrap Components with React.memo

Apply memo, useCallback, and useMemo together to eliminate unnecessary re-renders in a real dashboard.

Dashboard — no memoization applied

FilterBar renders: 1

StatsSummary renders: 1

  • Total Projects: 42
  • Active Members: 8
  • Completion Rate: 74%

This component receives no props — it should never re-render after mount.

Click any filter. Both FilterBar and StatsSummary flash — StatsSummary has no props and should be completely stable.

✦

Test Your Understanding

Multiple choice — select an answer to see the explanation.

1 / 4

A component is wrapped in React.memo but still re-renders on every parent state change. What is the most likely cause?

Re-read the lectureAll lectures →