Why is my React list still rerendering after normalizing state?

Baymax
Wed, 08 Apr 2026 06:00:12 +0000

Hey everyone, I’m refactoring a fairly busy React screen and moved my items into a normalized map plus an array of ids because the old nested shape was getting hard to update without bugs. The tradeoff is cleaner writes, but I expected fewer rerenders and the row components still light up in the profiler when one item changes.

const Row = React.memo(function Row({ item }) {
  console.log('render', item.id)
return {item.name}
})

export default function List({ itemsById, ids }) {
  return ids.map(id => (
    <Row key={id} item={{ ...itemsById[id] }} />
  ))
}

Am I defeating the whole point of normalization by recreating each item object during render, and what is the cleanest way to keep updates simple without making the whole list rerender?

BayMax

Read full topic