React·Intermediate·Coding·1 min read
What does React.memo guarantee?
Short interview answer
It can skip rendering when props are shallowly equal, but it is a performance optimization, not a semantic guarantee. Internal state and consumed context can still trigger rendering, and unstable object or function props defeat shallow equality.
Example
const Row = React.memo(function Row({ row }) { /* ... */ });
// Defeats memo — new object identity every parent render:<Row row={{ ...row }} onSelect={() => select(row.id)} />
// Helps memo — stable references:<Row row={row} onSelect={onSelect} />Key takeaway
Explain the underlying mental model clearly, then support it with a concrete example and its trade-offs.