Как useMemo сверяет пропсы?
Хуки
Вопрос содержит подмену: useMemo пропсы не сверяет — он сравнивает свой массив зависимостей. Пропсы сверяет React.memo. Механизм сравнения при этом у них общий.
Что сверяет useMemo
const config = useMemo(() => buildConfig(theme, locale), [theme, locale]);На каждом рендере React поэлементно сравнивает deps с прошлыми значениями через Object.is: все равны — возвращается кеш; хоть один отличается — колбэк пересчитывается. Пропсы компонента тут ни при чём — сравниваются только перечисленные зависимости (которые могут быть пропсами, а могут не быть).
Кто сверяет пропсы: React.memo
const Card = React.memo(CardInner);При рендере родителя React.memo делает shallow equal по всем пропсам (каждый через Object.is): равны — рендер пропускается.
Как они работают вместе
useMemo у родителя готовит стабильные ссылки, чтобы сравнение пропсов у memo-ребёнка проходило:
const Parent = () => {
const options = useMemo(() => ({ pageSize: 20 }), []); // стабильная ссылка
return <Card options={options} />; // memo сработает
};
// без useMemo options — новый объект каждый рендер → memo бесполезенОбщая механика сравнения
И deps useMemo, и пропсы в React.memo сравниваются одинаково: Object.is, поверхностно — примитивы по значению, объекты/функции/массивы по ссылке, без глубокого сравнения. Поэтому вся мемоизация в React строится на стабильности ссылок.
Коротко для собеседования
useMemo сверяет не пропсы, а свои deps (поэлементно, Object.is): равны — кеш, нет — пересчёт. Пропсы поверхностно сверяет React.memo. Связка: useMemo у родителя стабилизирует ссылки-пропсы, чтобы React.memo у ребёнка мог пропустить рендер; сравнение везде ссылочное, глубокого нет.