Можно ли использовать NavigationTimingAPI для асинхронных вызовов?

Question

В настоящее время я реализую функциональность измерения производительности в нашем проекте, который использует пользовательские элементы v1.

NavigationTimingAPI предлагает очень подробные измерения для различных типов навигации (навигация, перезагрузка, возврат браузера /вперед):

Может ли то же (или аналогичное подробное описание) быть доступным для асинхронных вызовов?Или есть другой API для того, о чем я не знаю?

То есть, когда страница полностью загружена и какое-то взаимодействие с пользователем или событие вызывает POST или GET на расположенном на сервере ресурсе.

Единственное, что я нашел до сих пор, это установление точек измерения с использованием performance.mark().

Я что-то упустил здесь?

Answer 1

Вы назвали Время навигации и нашли Время пользователя с performance.mark(), но пропустили API синхронизации ресурсов .Все три являются частью Performance Timing API .

Время навигации измеряет домашнюю страницу или приложение. Resource Timing API аналогичен, но он предоставляется для каждого отдельного асинхронно загруженного ресурса для его сопоставления с учетом времени навигации.

Подумайте об этом: Асинхронно загруженные файлыне имеет DOM для запуска !Это означает, что dom-properties отсутствует в хронометраже ресурса.Но начальная часть такая же, как и во время навигации:

Как насчет startTime , который является наиболее важным свойством Performance TimingAPI?У каждого асинхронного вызова есть свои! startTime равно 0 для документа и >0 мс для файлов и ресурсов Javascript.

startTime является первой записанной отметкой времени - источником мер.Он отмечает время, когда браузер впервые запускает процесс загрузки ресурса.В хронометраже ресурса startTime совпадает с fetchStart или redirectStart (если не ноль) при синхронизации ресурса.

Ресурсы в виде CSS или изображений не имеют ни dom, ни исполнения, но ресурсы с расширением .js выполняют Javascript, поэтому возможна пользовательская синхронизация с performance.mark(), как вы уже узнали.

• Можно ли использовать NavigationTimingAPI для асинхронных вызовов?

Да и Нет. Ресурсная синхронизация автоматически получает метки, которые могут относиться к навигационной синхронизации, чтосделать очень полезные сравнения.Так что да, но нет: измерение index.html (навигация) и измерение асинхронных вызовов (ресурсов) не одно и то же:
Измените performance.getEntriesByType("navigation") на performance.getEntriesByType("resource").

Answer 2

Я пропустил очевидное здесь.

Каждый XMLHTTPRequest со всеми применимыми деталями автоматически доступен как PerformanceResourceTiming объект в

performance
  .getElementsByType("resource")
  .filter(function(x) { 
    return x.initiatorType === "xmlhttprequest";
  });

Я смотрел только на объект performance.timing (фактически единственное, что недоступно через performance.getElementsByType()).