What is the purpose of keys in lists?

What is the purpose of keys in lists?

• A. They enforce unique styling for each list item.
• B. They help React identify which items have changed, been added, or removed.
• C. They determine the rendering order of elements.
• D. They store data for each list item.

Answer: (B)

Keys in lists let React identify which items have changed, been added, or removed between renders. When you render a list, each item gets a unique, stable key from your data. This lets React's reconciliation algorithm map the previous tree to the new one, reuse DOM nodes for items that stay the same, and apply only the minimal updates when items are added, removed, or reordered. Because of that, proper keys also help preserve internal state in list items and UI behaviors when the list changes. Avoid using the array index as a key if items can be reordered or filtered, since that can cause mismatches. Keys are not about styling or data storage; they're a tool for React's update process, not about the data you render.

Keys in lists let React identify which items have changed, been added, or removed between renders. When you render a list, each item gets a unique, stable key from your data. This lets React's reconciliation algorithm map the previous tree to the new one, reuse DOM nodes for items that stay the same, and apply only the minimal updates when items are added, removed, or reordered. Because of that, proper keys also help preserve internal state in list items and UI behaviors when the list changes. Avoid using the array index as a key if items can be reordered or filtered, since that can cause mismatches. Keys are not about styling or data storage; they're a tool for React's update process, not about the data you render.