PerformanceLongAnimationFrameTiming

Интерфейс PerformanceLongAnimationFrameTiming определен в API длинных анимационных кадров и предоставляет метрики длинных анимационных кадров (LoAF), которые занимают рендеринг и блокируют выполнение других задач.

Длинные анимационные кадры (LoAF) — это обновления рендеринга, которые отстают более чем на 50 мс. LoAF могут привести к медленным обновлениям пользовательского интерфейса (UI), в результате чего элементы управления будут казаться неотзывчивыми, вызывая неровные (негладкие) эффекты анимации и прокрутки. Это часто приводит к раздражению пользователя.

Интерфейс PerformanceLongAnimationFrameTiming предоставляет следующий подробный набор информации о LoAF, что позволяет разработчикам сузить причины проблем:

• Подробный набор временных меток для каждого LoAF.
• Подробная информация о каждом скрипте, который способствовал созданию LoAF, через свойство PerformanceLongAnimationFrameTiming.scripts. Оно возвращает массив объектов PerformanceScriptTiming, по одному для каждого скрипта.

PerformanceLongAnimationFrameTiming наследуется от PerformanceEntry.

Этот интерфейс расширяет следующие свойства PerformanceEntry для записей производительности длинных анимационных кадров:

PerformanceEntry.duration Только для чтения Экспериментально

Возвращает DOMHighResTimeStamp, представляющий время в миллисекундах, затраченное на обработку LoAF целиком.

PerformanceEntry.entryType Только для чтения Экспериментально

Возвращает тип записи, который всегда "long-animation-frame".

PerformanceEntry.name Только для чтения Экспериментально

Возвращает имя записи, которое всегда "long-animation-frame".

PerformanceEntry.startTime Только для чтения Экспериментально

Возвращает DOMHighResTimeStamp, представляющий время начала анимационного кадра.

Этот интерфейс также поддерживает следующие свойства:

PerformanceLongAnimationFrameTiming.blockingDuration Только для чтения Экспериментально

Возвращает DOMHighResTimeStamp, указывающий общее время в миллисекундах, в течение которого основной поток был заблокирован от реагирования на задачи высокого приоритета, такие как ввод пользователя. Это рассчитывается путем взятия всех длинных задач внутри LoAF, которые имеют duration более чем 50ms, вычитания 50ms из каждого, добавления времени рендеринга к времени самой длительной задачи и суммирования результатов.

PerformanceLongAnimationFrameTiming.firstUIEventTimestamp Только для чтения Экспериментально

Возвращает DOMHighResTimeStamp, указывающий время первого события UI, например, события мыши или клавиатуры, которое было помещено в очередь во время текущего кадра анимации.

PerformanceLongAnimationFrameTiming.renderStart Только для чтения Экспериментально

Возвращает DOMHighResTimeStamp, указывающий начальное время цикла рендеринга, который включает вызовы Window.requestAnimationFrame(), расчет стилей и макета, вызовы ResizeObserver и вызовы IntersectionObserver.

PerformanceLongAnimationFrameTiming.scripts Только для чтения Экспериментально

Возвращает массив экземпляров PerformanceScriptTiming.

PerformanceLongAnimationFrameTiming.styleAndLayoutStart Только для чтения Экспериментально

Возвращает DOMHighResTimeStamp, указывающий начало периода времени, затраченного на вычисления стилей и макета для текущего кадра анимации.

PerformanceLongAnimationFrameTiming.toJSON() Экспериментально

Возвращает JSON-представление объекта PerformanceLongAnimationFrameTiming.

См. Время длинных анимационных кадров для примеров, связанных с API длинных анимационных кадров.

• Длительность кадра анимации
• PerformanceScriptTiming