> Нужно ли использовать useMemo или useRef для хранения статичных данных в React? (React)
Уровень: senior · Роль: frontend · Категория: Технические вопросы
Компании: Альфа-банк
Стек: React
> Пример ответа
Для хранения статичных данных (значений, которые не меняются между рендерами и не участвуют в вычислениях) в React предпочтительнее использовать useRef, а не useMemo.
useRef создаёт объект с неизменяемой ссылкой, который сохраняется на протяжении всего жизненного цикла компонента. Он не вызывает перерендеров и идеально подходит для хранения любых статичных значений (например, конфигураций, экземпляров классов, DOM-элементов, таймеров).
useMemo предназначен для мемоизации результатов дорогостоящих вычислений, которые зависят от определённых зависимостей. Если данные статичны и не требуют вычислений, useMemo избыточен - он всё равно будет вызываться при каждом рендере (хотя и возвращать кешированное значение), что добавляет лишнюю работу.
Пример:
JSX// Плохо: useMemo для статичных данныхconst config = useMemo(() => ({ theme: 'dark', lang: 'ru' }), []);// Хорошо: useRef для статичных данныхconst configRef = useRef({ theme: 'dark', lang: 'ru' });// Доступ: configRef.current
Исключение: если статичные данные используются в качестве зависимостей других хуков (например, useEffect), useRef может быть неудобен, так как его .current не является стабильной ссылкой для сравнения. В таких случаях допустимо использовать useMemo с пустым массивом зависимостей, но это скорее костыль, а не правило.
> Похожие задачи по frontend
Как удалить последний элемент массива в setState без мутаций в React?
Зачем использовать setState с колбэком в React?
Использовал ли ты библиотеки для виртуализации списков в React
Почему рефы устанавливаются раньше полного рендера в React
> ГОТОВЫ К СЛЕДУЮЩЕМУ СОБЕСЕДОВАНИЮ?
Запустите тренировочную сессию с ИИ и получите детальную обратную связь, чтобы увереннее проходить реальные интервью