Ответ
Мемоизация — это оптимизация производительности, при которой результат функции кешируется и возвращается при повторных вызовах с теми же аргументами. В React для этого используются хуки useMemo и useCallback, а также HOC React.memo.
Пример с useMemo:
const expensiveCalculation = (num) => {
// Тяжёлые вычисления
return num * 2;
};
const Component = ({ value }) => {
const memoizedValue = useMemo(() => expensiveCalculation(value), [value]);
return <div>{memoizedValue}</div>;
};Пример с React.memo:
const MemoizedComponent = React.memo(({ prop }) => {
return <div>{prop}</div>;
});Мемоизация предотвращает лишние ререндеры и вычисления, но не стоит применять её везде — только там, где это действительно улучшает производительность.
Ответ 18+ 🔞
Да ты послушай, что за модное слово такое — мемоизация! Это ж просто, блядь, умное название для обычного кеширования, как в ларьке «запомнил — и хуй забудешь». Суть в чём: если функция уже считала какой-то пиздец с одними и теми же аргументами, зачем ей опять париться? Берём готовый результат из кармана и выдаём, не дергаясь.
В Реакте, конечно, свои приблуды для этого дела. Вот useMemo, например, — он как раз для тяжёлых вычислений, чтобы не ебать мозги компоненту на каждом рендере.
const expensiveCalculation = (num) => {
// Тяжёлые вычисления
return num * 2;
};
const Component = ({ value }) => {
const memoizedValue = useMemo(() => expensiveCalculation(value), [value]);
return <div>{memoizedValue}</div>;
};Видишь? Пока value не поменялся, expensiveCalculation не запустится опять. Сидит, блядь, в кеше, как сыч в дупле.
А ещё есть React.memo — это уже для целых компонентов, чтобы они не перерисовывались почём зря, если пропсы те же самые.
const MemoizedComponent = React.memo(({ prop }) => {
return <div>{prop}</div>;
});Но вот что важно, ёпта: не надо этой мемоизацией всю хуйню обмазывать, как майонезом салат. Иначе получится пиздопроебищно — накладные расходы на сравнение пропсов и кеширование могут оказаться тяжелее, чем просто посчитать заново. Используй точечно, только где реально тормоза чувствуются, а не от охуения от возможностей.