Velocity.js использует расширенную систему параметров, выходящую за пределы стандартной CSS-анимации. Помимо набора свойств, описывающих конечное состояние элементов, библиотека оперирует специальными опциями, управляющими временем, поведением очередей, аппаратным ускорением, коллбэками и логикой воспроизведения анимаций. Эти параметры передаются в виде объекта и интерпретируются движком отдельно от анимируемых CSS-свойств.
duration определяет длительность анимации в миллисекундах. Значение влияет на общую скорость интерполяции между начальным и конечным состоянием. При отсутствии явного указания используется стандартное значение библиотеки, обеспечивающее среднюю плавность перехода.
delay задаёт задержку перед стартом анимации. В течение этого времени изменения свойств не происходят, но элемент уже находится в очереди исполнения. Задержка применяется как к одиночным элементам, так и к группам, сохраняя синхронизацию последовательностей.
easing управляет кривой изменения скорости. Вместо линейной интерполяции используются функции ускорения и замедления, включая предустановленные и пользовательские кривые Безье. Этот параметр влияет на восприятие динамики движения, формируя характер анимации: плавный, резкий или упругий.
queue определяет, будет ли анимация добавлена в
очередь выбранного элемента или выполнена немедленно. При значении
false анимация выполняется параллельно с другими, минуя
стандартную последовательность. При строковом значении создаются
именованные очереди, позволяющие разделять потоки анимаций по логическим
каналам.
Очереди обеспечивают строгий контроль последовательности изменений. Каждый элемент хранит собственный стек операций, что позволяет выстраивать сложные сценарии движения без конфликтов между анимациями.
begin вызывается перед стартом анимации. На этом этапе уже известны параметры расчёта, но визуальные изменения ещё не применяются. Используется для подготовки состояния интерфейса.
progress вызывается на каждом кадре выполнения. Передаётся прогресс в диапазоне от 0 до 1, отражающий текущее состояние анимации. Этот параметр позволяет синхронизировать внешнюю логику с движением элементов.
complete срабатывает после завершения всех переходов. В случае работы с очередями вызывается после завершения всей цепочки, а не отдельного шага.
Коллбеки интегрируются в поток исполнения без блокировки анимационного цикла, что позволяет выполнять дополнительные операции без влияния на производительность интерполяции.
display изменяет CSS-свойство display в
момент начала или завершения анимации. При скрытии элемента значение
может устанавливаться автоматически, например в none, после
завершения затухания.
visibility управляет свойством видимости. В отличие
от display, элемент сохраняет своё место в потоке
документа, но становится невидимым. Это позволяет создавать плавные
переходы появления без переразметки страницы.
Комбинация display и visibility
используется для точного контроля состояния DOM-элементов в процессе
анимации, особенно при работе с интерфейсами, где важно сохранить
геометрию макета.
mobileHA включает или отключает аппаратное ускорение на мобильных устройствах. При активации используются CSS-трансформации и GPU-ускоренные слои, что снижает нагрузку на процессор и повышает плавность анимаций.
В современных реализациях влияние этого параметра связано с оптимизацией компоновки слоёв. Использование ускорения особенно заметно при одновременной анимации множества элементов.
loop задаёт повторяемость анимации. При логическом
значении true цикл повторяется бесконечно. Числовые
значения определяют конкретное количество повторов. Каждый новый цикл
повторяет интерполяцию с учётом начальных параметров.
reverse изменяет направление анимации на противоположное. При включении текущее состояние интерпретируется как конечное, а начальное и конечное значения меняются местами. В сочетании с циклами создаются эффекты маятникового движения.
Комбинация loop и reverse формирует
непрерывные колебательные сценарии без необходимости ручного управления
состояниями.
begin, complete и progress дополняются внутренними механизмами остановки и перерасчёта состояния. При прерывании анимации текущие значения фиксируются, а последующие вызовы очередей пересчитываются с учётом нового состояния элемента.
Это особенно важно при динамических интерфейсах, где одна анимация может быть заменена другой до завершения предыдущей.
При работе с наборами элементов специальные свойства применяются либо к каждому элементу отдельно, либо ко всей группе. Поведение зависит от способа вызова функции. В групповых операциях коллбеки могут вызываться для каждого элемента или единожды для всей коллекции.
Такой механизм позволяет синхронизировать сложные сцены, где элементы должны двигаться согласованно либо с заданным смещением во времени.
Специальные параметры не смешиваются с анимируемыми CSS-атрибутами. Они интерпретируются отдельным слоем логики и влияют на выполнение, а не на конечное состояние. Это разделение обеспечивает предсказуемость: визуальные свойства описывают результат, специальные — процесс достижения результата.
Разграничение этих уровней позволяет строить сложные сценарии анимации без конфликтов между вычислениями стилей и логикой исполнения.