#055Object Identity Breaks Memo
react.easyREACT
1function Parent() {
2 const [count, setCount] = useState(0);
3
4 const config = { theme: 'dark', size: 'lg' };
5
6 return (
7 <>
8 <button onClick={() => setCount(c => c + 1)}>Inc</button>
9 <MemoChild config={config} />
10 </>
11 );
12}
13
14const MemoChild = React.memo(({ config }) => {
15 console.log('rendered');
16 return <div style={{ color: config.theme }}>{config.size}</div>;
17});
no lines flagged
#055PracticeEasy10 min · 50 XP
Object Identity Breaks Memo
A React.memo-wrapped child re-renders on every parent render despite no visible prop changes.
Flagged lines
No lines flagged yet
What's wrong?
Flag a line or write a note to submit.