> Что такое shallowRef и shallowReactive и каково их назначение во Vue (React, Vue.js)

Уровень: junior · Роль: frontend · Категория: Технические вопросы

Компании: ЛОЦИЯ

Стек: React, Vue.js

> Пример ответа

shallowRef и shallowReactive - это инструменты Vue 3 для оптимизации реактивности, когда глубокая реактивность не требуется или избыточна.

shallowRef - аналог ref, но делает реактивным только само значение (через .value), не отслеживая изменения внутри объекта или массива. Полезен для больших неизменяемых данных (например, результат API, который заменяется целиком) или для интеграции с внешними библиотеками (Three.js, Chart.js), где мутация внутренностей объекта не нужна.

shallowReactive - аналог reactive, но реагирует только на изменения корневых свойств объекта. Вложенные объекты остаются нереактивными. Применяется, когда структура данных плоская или вложенные части обновляются редко и вручную.

Основное назначение - повышение производительности за счёт уменьшения количества прокси-объектов и watcher'ов. Вместо глубокого рекурсивного обхода Vue отслеживает только первый уровень, что снижает накладные расходы на больших или глубоких структурах данных.

> ГОТОВЫ К СЛЕДУЮЩЕМУ СОБЕСЕДОВАНИЮ?

Запустите тренировочную сессию с ИИ и получите детальную обратную связь, чтобы увереннее проходить реальные интервью