Rendering lists

Списки рендерятся через map данных в элементы внутри JSX. Каждому соседу нужен стабильный `key`, чтобы React сопоставлял элементы между render. Пустые коллекции показывайте явным empty state, а не пустотой.

Сортировку и фильтрацию обычно выполняют до render — render должен оставаться чистой функцией props и state. Не используйте индекс как key, если элементы переставляют, вставляют или удаляют; берите устойчивый id записи.

					{items.map((item) => (
  <Row key={item.id} item={item} />
))}
				

Для очень длинных списков нужны пагинация или виртуализация, но правило key неизменно: идентичность должна отражать строку данных, а не только позицию.

На интервью объясняйте концепцию на конкретном примере и называйте поведение, которое проверяют.

Типовые ошибки: скрывать поток данных, дробить компоненты чрезмерно и выполнять побочные эффекты в render.

Компромисс часто между ясностью и переиспользованием или между явными props и удобством.

Чеклист:

• Преобразуйте данные в элементы со стабильными key.
• Явно показывайте пустое и загрузочное состояние.
• Готовьте отсортированные и отфильтрованные массивы до JSX.