Как собрать и отправить данные по загрузке страницы?
Доброго дня!
Поставили задачу написать скрипт, который будет собирать и отправлять get-запросом данные по загрузке страницы (скорость загрузки, отрисовка DOM, загрузка и применение/выполнение скриптов, стилей, контента и т.п.).
Нужно это, чтобы определить, будет ли польза от использования CDN.
Гугл выдает преимущественно сервисы, предоставляющие аналогичные данные, а мне надо именно скрипт, который будет отрабатывать на каждой странице.
Если кто сталкивался лично - подскажите, пожалуйста, как это сделать? )) Хотя бы в каком направлении копать? А если есть пример чего-то подобного – то совсем круто.
Выручайте ))
UPD: спасибо за комментарий, частично помогло, но глобально вопрос стоял шире.
В итоге задача решается с использованием Navigation Timing API, там можно получить уйму параметров и на основе них посчитать все, что надо.
let a = Date.now()
//браузер полностью загрузил HTML, было построено DOM-дерево, но внешние ресурсы, такие как картинки <img> и стили, могут быть ещё не загружены.
document.addEventListener('DOMContentLoaded', () => {
let s = Date.now() - a
//send 's' to server
})
//браузер загрузил HTML и внешние ресурсы (картинки, стили и т.д.).
document.addEventListener('load', () => {
let s = Date.now() - a
//send 's' to server
})
Можно хоть на каждый скрипт или картинку 'load' повесить и чекать
P.S. в chrome devtools -> network время загрузки каждого компонента отображается
