Chrome - разница между временем события в графике времени devtools и графике времени выполнения
Я пытаюсь получить, например, loadEventEnd время в консоли. Вы можете сделать это с помощью производительности 2 API-интерфейсов или API-интерфейс производительности.
Я получаю те же результаты, выполнив следующие вычисления:
performance.getEntriesByType("navigation")[0].loadEventEnd
// 483.915
chrome.loadTimes().finishLoadTime * 1000 - chrome.loadTimes().startLoadTime * 1000
// 484
performance.timing.loadEventEnd - performance.timing.navigationStart
// 484
Но на вкладке Timeline в devtools я получаю результат 510 мс.
Различия показаны на этом рисунке:
![введите описание изображения здесь]()
Эта проблема возникает на других сайтах: в консоли я всегда получаю меньше времени, чем на вкладке Timeline.
Может ли кто-нибудь объяснить эту разницу?
Какое время реально?
Ответы
Ответ 1
Как поясняет @Dragomok в комментарии:
navigation-timing-api начинает запись в событии navigationStart. График вкладки вкладки производительности запускает записи "некоторое время" перед событием navigationStart, поэтому performance.getEntriesByType("navigation")[0].loadEventEnd дает меньшее значение, чем loadEventEnd на временной шкале.
Если вы подсчитаете временную шкалу loadEventEnd - navigationStart, вы получите то же значение, что и в navigation-timing-api.
Вот доказательство в картинках:
![введите описание изображения здесь]()
![введите описание изображения здесь]()
