Skip to main content
Journey Uncommon Logo
JourneyUncommon
hardReactreconciliation diffingSingle-choice MCQ

Consider this list reconciliation. The list goes from `['a','b','c']` to `['c','a','b']` and each item is keyed by its string value. Counting only DOM node creations/destructions (not pointer moves), how does React's keyed children diff handle this, and what is the minimum DOM mutation cost?

// before <ul> <li key="a">a</li> <li key="b">b</li> <li key="c">c</li> </ul> // after <ul> <li key="c">c</li> <li key="a">a</li> <li key="b">b</li> </ul>