Глоссарий Vue

Глоссарий терминов Vue.js необходим для того, чтобы новички и опытные разработчики могли быстро ориентироваться в ключевых понятиях и механизмах фреймворка. Он помогает понять, как различные компоненты и API взаимодействуют между собой, облегчает изучение новых концепций и улучшает коммуникацию внутри команды разработчиков, обеспечивая единое понимание терминологии.

Асинхронный компонент (async component)

Компонент, который загружается асинхронно, обычно с помощью функции, возвращающей промис. Используется для оптимизации загрузки и уменьшения времени начальной загрузки приложения.

Макросы компилятора (compiler macro)

Специальные конструкции, которые используются на этапе компиляции для преобразования шаблонов в код. Например, v-for и v-if являются макросами, которые компилятор преобразует в JavaScript.

Компонент (component)

Основной строительный блок Vue-приложений. Компоненты позволяют разбивать интерфейс на переиспользуемые и изолированные части.

Композабл (composable)

Функция, используемая в Composition API для повторного использования логики между компонентами. Обычно возвращает реактивные состояния и методы.

Composition API

Новый способ написания компонентов, представленный в Vue 3. Позволяет лучше управлять логикой и состоянием компонентов через функции, такие как setup.

Пользовательские элементы (custom element)

HTML-элементы, определенные пользователем, которые могут быть использованы в любом месте приложения. Обычно создаются с помощью Web Components API.

Директива (directive)

Специальные атрибуты, которые добавляют динамическое поведение к элементам DOM. Например, v-bind, v-model, v-if.

Динамический компонент (dynamic component)

Компонент, который может изменяться на лету в зависимости от состояния или пропсов. Обычно используется с <component :is="componentName">.

Эффект (effect)

Функция, которая выполняется при изменении реактивного состояния. Используется для создания побочных эффектов, таких как обновление DOM.

Событие (event)

Механизм для передачи данных или уведомлений между компонентами. В Vue события обрабатываются с помощью системы событийного эмиттера.

Фрагмент (fragment)

Невидимый контейнер, который позволяет группировать несколько элементов, не добавляя дополнительный элемент в DOM.

Функциональный компонент (functional component)

Легковесный компонент без состояния и хуков жизненного цикла. Определяется как функция, принимающая пропсы и возвращающая виртуальный DOM.

Подъем (hoisting)

Перемещение деклараций функций или переменных в начало их области видимости. В контексте Vue может относиться к подъемам реактивных переменных в Composition API.

Шаблон в DOM (in-DOM template)

Шаблон, который определяется непосредственно в HTML, а не в JavaScript. Обычно используется с однофайловыми компонентами или встраиваемыми шаблонами.

Инъекция (inject)

Механизм передачи данных от родительского компонента к дочернему через provide/inject API. Позволяет создавать зависимости между компонентами.

Хуки жизненного цикла (lifecycle hooks)

Методы, которые вызываются на определенных этапах жизненного цикла компонента, таких как создание, монтирование, обновление и уничтожение.

Макрос (macro)

См. «макросы компилятора».

Именованный слот (named slot)

Слот, который позволяет вставлять контент в определенное место внутри компонента. Именованные слоты позволяют более гибко управлять разметкой.

Options API

Традиционный способ написания компонентов в Vue 2 и Vue 3. Использует объектную структуру для определения опций компонента, таких как data, methods, computed.

Плагин (plugin)

Расширение для Vue, которое добавляет глобальные функции, директивы или компоненты. Плагины могут быть зарегистрированы с помощью метода Vue.use().

Входной параметр (prop)

Атрибут, который передается компоненту от его родителя. Props позволяют передавать данные и управлять поведением дочерних компонентов.

provide / inject

API для передачи данных от родительского компонента к дочерним без явного прокидывания через props. provide определяет данные, а inject их потребляет.

Реактивный эффект (reactive effect)

Функция, которая автоматически выполняется при изменении реактивного состояния. Создается с помощью watchEffect или других реактивных инструментов.

Реактивность (reactivity)

Механизм, который отслеживает изменения состояния и автоматически обновляет представление. В Vue это достигается с помощью реактивных объектов и эффектов.

API Реактивности (Reactivity API)

Набор функций и инструментов, предоставляющих реактивные возможности, такие как ref, reactive, computed и watch.

ref

Функция для создания реактивного объекта, который отслеживает одно значение. Используется для создания реактивных примитивов.

Рендер функция (render function)

Функция, которая описывает, как должен выглядеть виртуальный DOM компонента. Предоставляет более гибкий способ создания представления по сравнению с шаблонами.

Планировщик (scheduler)

Механизм, который управляет очередью выполнения задач и их приоритетами. В Vue используется для оптимизации обновлений DOM.

Слоты с ограниченной областью видимости (scoped slot)

Слоты, которые позволяют передавать данные из дочернего компонента в родительский через специальный синтаксис. Позволяют гибко управлять разметкой и данными.

SFC (Single File Component)

Однофайловый компонент, который объединяет шаблон, логику и стили в одном файле с расширением .vue.

Сайд эффект (side effect)

Любое действие, которое изменяет состояние вне локальной области функции. В Vue часто используется для описания реактивных эффектов.

Однофайловый компонент

См. «SFC».

Слот (slot)

Место в компоненте, куда можно вставить пользовательский контент. Позволяет создавать гибкие и переиспользуемые компоненты.

Ссылки на элементы шаблона (template ref)

Механизм для получения доступа к DOM-элементам или дочерним компонентам напрямую из шаблона. Определяются с помощью атрибута ref.

VDOM (Virtual DOM)

См. «Виртуальный DOM».

Виртуальный DOM (virtual DOM)

Абстракция реального DOM, которая позволяет эффективно обновлять представление. Виртуальный DOM используется для минимизации манипуляций с реальным DOM.

VNode

Виртуальный узел, который представляет собой абстракцию реального DOM-узла. Используется в виртуальном DOM для описания структуры интерфейса.

Веб-компонент (Web Component)

Технология для создания пользовательских HTML-элементов с инкапсулированной логикой и стилями. Включает в себя Custom Elements, Shadow DOM и HTML Templates.