Какие проблемы решает useMemo

useMemo оптимизирует производительность, предотвращая избыточные вычисления в компонентах React. Он кэширует результат вычислений между рендерами, пересчитывая его только при изменении зависимостей.

Основные сценарии:

1. Тяжёлые вычисления – если компонент часто ререндерится, а вычисления сложные (фильтрация, сортировка и т.д.).
2. Стабилизация ссылок – когда нужно передать стабильный объект/массив в дочерние компоненты или хуки (например, useEffect).

Пример:

const sortedList = useMemo(() => {
  return hugeArray.sort((a, b) => a.value - b.value);
}, [hugeArray]); // Пересчитается только при изменении hugeArray

⚠️ Не злоупотребляйте: для простых операций накладные расходы useMemo могут превысить выгоду.