search
1.1 Автоматический поиск плагинов
SFLoaderPlugin реализует механизм автоматического обнаружения плагинов, которые нужно загрузить на страницу. Он сканирует DOM и находит нужные компоненты двумя способами:
1. По наличию специального атрибута (по умолчанию sf-asset);
2. По регулярным выражениям в атрибутах, если задан параметр findPlugins.
Как это работает
1. Поиск по DOM
Загрузчик сканирует все элементы на странице и ищет те, у которых есть указанный атрибут:
<div sf-asset="modal"></div>
В этом примере будет найден плагин modal, и он автоматически добавится в очередь на загрузку
2. Поиск через RegExp
Если в конфигурации передан объект findPlugins, то загрузчик будет проверять все атрибуты всех элементов, чтобы сопоставить их с регулярными выражениями.
Пример:
findPlugins: {slider: {regex: /sf-slider/,type: 'component'}}
Если элемент содержит, например, data-role="sf-slider", то будет добавлен плагин slider.
3. Автоматический мониторинг (MutationObserver)
После первоначальной загрузки, SFLoaderPlugin запускает MutationObserver, который отслеживает любые изменения в DOM:
- Подгрузка новых элементов (например, через AJAX);
- Изменения в DOM-дереве.
Новые элементы проверяются тем же механизмом, и если найдены новые плагины — они будут немедленно загружены.
4. Внутренние методы
search() — Запускает наблюдение за DOM-изменениями
searchRegexp() — Проверяет DOM по регулярным выражениям (findPlugins)
getAttributes() — Извлекает атрибуты у DOM-элементов для анализа
5. Пример работы
<!-- Простой компонент -->
<div sf-asset="tooltip"></div>
<!-- Компонент, определяемый через регулярное выражение -->
<div data-role="sf-slider"></div>
Если указать в findPlugins правило для slider, то он тоже будет загружен.
6. Особенности
- Поддерживается множественная загрузка (несколько одинаковых компонентов — один вызов).
- Учитываются как статические, так и динамические элементы.
- Можно использовать кастомный атрибут вместо sf-asset (через параметр attr).