Каким условиям должен отвечать key?

`key` должен быть: уникальным среди соседей, стабильным (не меняться между рендерами), предсказуемым (id из данных, не индекс при динамике и не случайный).

Требования к key

Уникальность среди соседей

key уникален в пределах одного списка (у соседних элементов). В разных списках могут повторяться:

{users.map((user) => <li key={user.id}>{user.name}</li>)}

Стабильность

Не должен меняться между рендерами для того же элемента, иначе React пересоздаёт элемент (теряет состояние, лишние ре-рендеры):

// Плохо — новый key каждый рендер
<li key={Math.random()}> // пересоздаётся всегда!

Предсказуемость (id из данных)

Использовать стабильный уникальный идентификатор из данных:

key={user.id}        // хорошо — стабильный id
key={item.uuid}      // хорошо

Не индекс (при динамике)

Индекс сдвигается при вставке/удалении/сортировке → React путает элементы (баги состояния). Индекс допустим только для статичных списков без переупорядочивания:

key={index} // плохо при изменении порядка

Что ломается при нарушении

• Неуникальные → предупреждение, некорректное обновление.
• Нестабильные (Math.random) → пересоздание, потеря состояния, плохая производительность.
• Индекс при динамике → перепутанное состояние инпутов, лишние ре-рендеры.

Коротко для собеседования

key должен быть: уникальным среди соседей, стабильным (не меняться между рендерами — не Math.random()), предсказуемым (id из данных). Не использовать индекс при динамических списках (сдвигается при вставке/удалении → баги состояния); индекс — только для статичных. Нарушение ведёт к потере состояния и лишним ре-рендерам.