Устаревшие функции

Unpoly — библиотека для упрощения динамического обновления страниц без полной перезагрузки. С течением времени некоторые функции были признаны устаревшими и не рекомендуются к использованию в новых проектах. Понимание этих функций важно для поддержки старого кода и грамотной миграции на современные подходы.

Ранее Unpoly позволял явно задавать метод HTTP при навигации через up.link, включая нестандартные методы вроде PUT и DELETE. Прямое использование таких методов считалось устаревшим из-за потенциальной непредсказуемости поведения браузеров и ограничений кэширования. Вместо этого рекомендуется:

up.submit(form, { method: 'PUT' });

Использование up.submit для нестандартных методов позволяет правильно формировать запросы и обрабатывать ответы с учётом всей цепочки событий Unpoly.

up.reload()

Метод up.reload() позволял полностью перезагружать текущий фрагмент или страницу. Он считался удобным для обновления контента, но создавал лишнюю нагрузку на сервер и приводил к потере состояния на странице. Начиная с последних версий, предпочтительным подходом является обновление конкретных блоков через up.replace() или up.render():

up.replace('#user-list', '/users/fragment');

Такой подход обеспечивает селективное обновление, сохраняя состояние других элементов на странице и улучшая производительность.

Использование глобальных колбеков up.on('all')

Ранее для отслеживания всех событий Unpoly применялся глобальный обработчик:

up.on('all', function(event) {
  console.log(event.type);
});

Этот способ устарел, так как создаёт нагрузку на производительность и затрудняет отладку. Рекомендуется привязывать события к конкретным областям и типам событий:

up.on('up:fragment:loaded', '#comments', function(event) {
  console.log('Комментарии обновлены');
});

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

Атрибуты up-target и up-swap без явного указания

Ранее допустимо было оставлять атрибут up-target пустым или опираться на дефолтное поведение. Сейчас такая практика считается устаревшей, так как в сложных интерфейсах она создаёт непредсказуемые результаты. Явное указание селектора для обновления элементов обеспечивает более стабильное поведение:

<a href="/users/42" up-target="#user-detail" up-swap="outerHTML">Показать детали</a>

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

up.transition с устаревшими эффектами

Некоторые эффекты анимации, такие как fade и slide, ранее задавались глобально через up.transition и могли применяться к любому обновлению фрагмента. В новых версиях рекомендуется использовать локальные и конфигурируемые переходы через атрибуты up-swap:

<div id="content" up-swap="outerHTML fade">
  ...
</div>

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

Устаревшие свойства конфигурации

Некоторые глобальные настройки, такие как:

up.options.cache = false;
up.options.scroll = false;

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

up.replace('#posts', '/posts/latest', { cache: false, scroll: true });

Это позволяет управлять поведением точечно, не затрагивая все операции Unpoly на странице.

События up:layer:opened и up:layer:closed без контекста

Ранее события открытия и закрытия слоёв (layers) могли использоваться без указания конкретного селектора. Такой подход создавал сложности при работе с множеством слоёв на одной странице. Теперь рекомендуется привязывать события к конкретному слою:

up.on('up:layer:opened', '#login-modal', function() {
  console.log('Модальное окно логина открыто');
});

Это предотвращает случайные срабатывания и улучшает читаемость кода.

Итоговое замечание

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

Оглавление