This content originally appeared on DEV Community and was authored by Vivek Lagshetti
We often hear about useMemo, useCallback, and React.memo — but what exactly does React.memo do, and when should you use it?
Let’s explore with a real-time example using a Parent → Child component scenario.
🔴 Without React.memo
Here’s a simple setup:
- Parent has two states: count and text
- Child always receives a static prop (value="Static Prop")
👉 Problem:
Whenever you click Increase Count, the child re-renders unnecessarily. You can confirm this by checking the console logs.
🟢 With React.memo
Now let’s wrap our Child with React.memo.
This tells React:
“Only re-render this component if its props actually change.”
👉 Now, when you click Increase Count,
- The Parent re-renders (as expected)
- But the Child does NOT re-render, since its props remain the same
🎉 Check the console — you’ll see that the child only renders once, no matter how many times you increase the count.
✅ Advantages of React.memo
- Prevents unnecessary re-renders of child components
- Improves performance in large component trees
- Works best with pure components (output depends only on props)
⚡ Key Difference (React.memo vs useMemo)
- useMemo → Memoizes values/calculations inside a component
- React.memo → Memoizes entire components to skip re-rendering when props don’t change
🚀 Takeaway
If you’re passing static props (or props that rarely change) to child components, React.memo is a simple and powerful way to avoid wasteful re-renders.
💡 What about you? Do you use React.memo in your React projects? Have you ever faced unnecessary re-render issues? Let’s discuss!
Even though the child’s props never change, it still re-renders whenever the parent re-renders.
This content originally appeared on DEV Community and was authored by Vivek Lagshetti
Vivek Lagshetti | Sciencx (2025-09-12T06:15:36+00:00) ⚡ Optimizing React Performance with React.memo (Real-Time Example). Retrieved from https://www.scien.cx/2025/09/12/%e2%9a%a1-optimizing-react-performance-with-react-memo-real-time-example/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.