Что означает время domContentLoaded в веб-тестировании?
Я много читал о jQuery.ready() замедлит вашу страницу. Мой сайт имеет кучу кода, работающего внутри jQuery.ready() как и многие веб-сайты.
</body>
<script>
jQuery(document).ready(function() {
// Do some event binding and initialization.
});
</script>
Я помещаю этот скрипт в конце <body> тег, но я обернул код внутри DOM ready просто чтобы быть в безопасности.
Теперь я тестирую свою страницу на http://www.webpagetest.org/ и заметил, что domContentLoaded время выглядит следующим образом:
domContentLoaded
4.987s - 5.317s (0.330s)
Теперь я экспериментировал, удалив jQuery.ready(function() {}); быть просто
</body>
<script>
// Do some event binding and initialization.
</script>
И я снова тестирую страницу. Вот результат.
domContentLoaded
3.772s - 3.915s (0.143s)
Выполнение снижается до 0,1 с, что составляет около ~187ms, Правильно ли я предположить, что время выполнения уменьшается, потому что код не выполняется внутри jQuery.ready и что это означает с точки зрения увеличения производительности, например, воспринимаемой производительности. Чувствуют ли пользователи, что страница загружается быстрее?
2 ответа
Не является ли domContentLoaded тем же событием, захваченным $.ready? Если таймер веб-теста длится дольше, когда основной сценарий работает на $.ready, это может просто указывать на то, что в это время другие ресурсы конкурируют за ресурсы. имеет смысл, что если разрешить любую настройку и инициализацию, которые могут быть выполнены до этого события, то все настройки, происходящие при подготовке документа, будут работать более плавно...
domContentLoaded в веб-странице испытаний является document.ready в jquery
запустите ваш код на событие onLoad для повышения производительности
if("undefined"==typeof(addOnload)){function addOnload(a){if("undefined"!=typeof(window.attachEvent)){return window.attachEvent("onload",a)}else{if(window.addEventListener){return window.addEventListener("load",a,false)}}};}
вызовите вашу функцию при событии onload
addOnload(fnName);