Время загрузки страницы с помощью JQuery

Я хочу рассчитать время загрузки страницы; Это означает, что после второго 0 (загружен небольшой фрагмент jquery) во второй x, когда загружается вся страница.

Интересно, имел ли кто-нибудь опыт с ним, а также идеи о том, как правильно его реализовать, будут apperciated.

пожалуйста, мне не нужно расширение, у меня уже есть firebug, мне нужно решение js

спасибо:)

Ответы

Ответ 1

Как отмечали другие, это не будет ужасно точным. Но это должно работать разумно.

В <head>, т.е. как можно раньше:

<script>
   var startTime = (new Date()).getTime();
</script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script>
   $(window).load(function () {
       var endTime = (new Date()).getTime();
       var millisecondsLoading = endTime - startTime;
       // Put millisecondsLoading in a hidden form field
       // or Ajax it back to the server or whatever.
   });
</script>

Ключом является это поведение из документов jQuery:

При привязке к элементу окна событие срабатывает, когда пользовательский агент завершает загрузку всего содержимого в пределах документ, включая окно, рамки, объектов и изображений.

Ответ 2

Поскольку скрипты выполняются, как только они разбираются, я предлагаю разместить один тег script только внутри заголовка, а затем script, чтобы связать событие загрузки страницы после загрузки jQuery:

<html>
<head>
   <script>
      // Capture start time
   </script>
   ...
   <script src="jquery.js" />
   <script>
      $(window).load(function() {
         // Capture end time
      });
   </script>
...

Таким образом, вы сможете уловить как можно больше времени загрузки страницы.

Ответ 3

Возможно, вам лучше использовать плагин для браузера? Вычисление с помощью JavaScript потребует недооценки времени загрузки страницы, поскольку оно не будет включать время загрузки фрагмента jQuery и не будет включать время между браузером, отправляющим запрос, и веб-сервером, отвечающим?

Там есть плагин Load Time Analyzer для Firefox.

Ответ 4

Если вы делаете это с целью оптимизации, я предлагаю вам использовать Yslow. Это расширение Firebug-Firefox. Он может показать вам время загрузки страницы и множество других полезных сведений.

Ответ 5

Примечательный:

Например, следующий script показывает наивную попытку измерения времени, необходимого для полной загрузки страницы:

<html>
<head>
<script type="text/javascript">

var start = new Date().getTime();
function onLoad() {
  var now = new Date().getTime();
  var latency = now - start;
  alert("page loading time: " + latency);
}

</script>
</head>
<body onload="onLoad()">
<!- Main page body goes from here. -->
</body>
</html>

script рассчитывает время, необходимое для загрузки страницы после выполняется первый бит JavaScript в голове, но он не дает любую информацию о времени, которое требуется для получения страницы с сервер.

Чтобы удовлетворить потребность в полной информации об опыте пользователя, документ вводит интерфейсы PerformanceTiming. Этот интерфейс позволяет механизмам JavaScript обеспечивать полную латентность на стороне клиента измерения в приложениях. С предлагаемым интерфейсом предыдущий пример может быть изменен для измерения воспринимаемой пользователем страницы время загрузки.

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

<html>
<head>
<script type="text/javascript">
function onLoad() {
  var now = new Date().getTime();
  var page_load_time = now - performance.timing.navigationStart;
  alert("User-perceived page loading time: " + page_load_time);
}

</script>
</head>
<body onload="onLoad()">
<!- Main page body goes from here. -->
</body>
</html>

Ответ 6

Вы не можете сделать это с помощью jQuery, поскольку $(document).ready(); срабатывает при загрузке страницы.

Вы можете сделать это с помощью YSlow Firebug плагин для Firfox. Если вы хотите, чтобы это работало во всех браузерах, вам нужно добавить код сервера, чтобы показать, сколько времени потребовалось, когда первый элемент был записан в нижний элемент.

Если это не то, что вы хотели бы, вы можете использовать такой инструмент, как Selenium и написать тест для захвата времени от open до конца waitForPageToLoad. Селен работает во всех браузерах