время загрузки страницы с помощью Jquery - PullRequest
Новая
       21

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

10 голосов
/ 31 июля 2009

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

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

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

спасибо:)

Ответы [ 6 ]

21 голосов
/ 31 июля 2009

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

В вашем <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 :

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

1 голос
/ 31 июля 2009

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

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

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

0 голосов
/ 26 мая 2016

Прочитайте рекомендацию W3C для времени навигации

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

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

<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>

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

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

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

<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>
0 голосов
/ 31 июля 2009

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

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

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

0 голосов
/ 31 июля 2009

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

0 голосов
/ 31 июля 2009

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

Есть Анализатор времени загрузки плагин для Firefox.

...