Режимы атрибутов

Библиотека FAST Element предоставляет точный контроль над тем, как свойства компонента синхронизируются с HTML-атрибутами. Эта механика лежит в основе реактивности и корректного обмена данными с внешним миром, особенно при работе в контексте веб-компонентов, где важны соглашения о сериализации, типах и порядке обновления.

Общий принцип связи свойства и атрибута

Каждое публичное свойство компонента может быть связано с атрибутом. При этом возможны два направления передачи:

1. От атрибута к свойству: применяется при парсинге значения DOM.
2. От свойства к атрибуту: требуется для отражения (reflect) состояния компонента вовне.

FAST использует механизм «attribute behaviors», позволяя задавать тип, режим отражения и правила преобразования.

Основные режимы

Only Property

Режим, при котором значение определяется только свойством экземпляра и не имеет отображения в атрибуте. Это полезно для внутренних данных, вычисляемых значений или сложных структур.

Особенности:

• Атрибут в DOM не создаётся и не изменяется.
• Внешний HTML не способен показать текущее состояние компонента.
• Значение доступно только в рантайме через экземпляр.

Reflect to Attribute

Значение свойства автоматически синхронизируется с атрибутом. Такое отображение упрощает интеграцию с DOM-средой и CSS-селекторными механизмами, а также повышает читабельность при инспекции компонентов.

Ключевые моменты:

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

From Attribute

Режим, предназначенный для инициализации свойства на основе значения атрибута. FAST парсит строковое значение, применяя правила конвертации типов (boolean, number, string, enum и др.).

Отличительные черты:

• Значение считывается при подключении компонента к DOM.
• При изменении атрибута свойство получает обновлённое значение.
• Сериализация обратно в атрибут не производится.

Reflect & From Attribute (bidirectional)

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

Сильные стороны:

• Поддержка реактивности как из DOM, так и из логики компонента.
• Удобен для контролируемых элементов и интеграций с фреймворками.

Ограничения:

• Требует корректного преобразования типов при чтении и записи.
• Может приводить к циклам обновлений при ошибочной конфигурации.

Типизация значений

FAST предоставляет автоматические преобразователи для часто используемых типов:

• Boolean: атрибут присутствует/отсутствует.
• Number: парсинг через Number.
• String: значение атрибута используется напрямую.
• Enum: допускаются ограничения по набору.

Пользователь может определить собственный конвертер, реализующий методы fromView и toView.

Сериализация и десериализация

Сериализация требуется при отражении значения свойства в атрибут. Основные правила:

• Необъектные типы сериализуются в строку.
• Неопределённые значения способны приводить к удалению атрибута.
• Сложные структуры рекомендуется хранить в свойствах без отражения.

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

Связь с реактивностью

Режимы атрибутов напрямую влияют на реактивную модель:

• Отражение в атрибут может выступать триггером обновления внешних слушателей.
• Входящий поток через атрибут способен инициировать перерасчёты свойств.
• Механизм обновлений работает батчированно, минимизируя число перерисовок.

Практические соображения выбора режима

Выбор оптимального режима зависит от назначения свойства:

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

Взаимодействие с шаблонами и событиями

Режимы атрибутов работают совместно с шаблонной системой FAST. Значения, полученные из атрибутов, участвуют в биндингах и вычислениях. Событийная система реагирует на изменения свойств, что обеспечивает корректное обновление DOM. Отражённые атрибуты позволяют CSS выбирать состояния компонента без вмешательства в JS-код.

Нюансы реализации

FAST избегает ненужных обновлений атрибутов и свойств путём сравнения предыдущих и новых значений. Это снижает нагрузку на DOM и предотвращает повторные циклы. При использовании пользовательских типов ключевым моментом становится корректность функций преобразования, так как они определяют контракт между DOM-миром и внутренней логикой компонента.