11

ページの読み込み時間を計算したい。これは、ページ全体が読み込まれる 0 秒目 (小さな jquery スニペットが読み込まれた) から x 秒目までを意味します。

誰かがそれを経験したことがあるのだろうか、またそれを正しく実装する方法のアイデアも評価されるでしょう。

拡張機能は必要ありません。既に firebug を持っています。js ソリューションが必要です。

ありがとう ：）

4

6 に答える 6

2

スクリプトは解析されるとすぐに実行されるため、ヘッダーのすぐ内側に 1 つのスクリプト タグを配置し、jQuery をロードした後にページ ロード イベントをフックするスクリプトを配置することをお勧めします。

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

そうすれば、できるだけ多くのページ読み込み時間をキャッチできるはずです。

于 2009-07-31T09:36:50.100 に答える
0

ナビゲーション タイミングに関する 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>

このスクリプトは、head 内の 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>
于 2016-05-26T14:04:40.667 に答える
0

ブラウザのプラグインを使用した方がよいでしょうか? JavaScript で計算すると、jQuery スニペットをロードする時間が含まれず、ブラウザがリクエストを送信してから Web サーバーが応答するまでの時間が含まれないため、ページのロード時間を過小評価する必要がありますか?

Firefox 用のLoad Time Analyzerプラグインがあります。

于 2009-07-31T09:05:50.367 に答える
0

最適化のためにこれを行っている場合は、Yslowを使用することをお勧めします。これは、Firebug-Firefox 拡張機能です。ページの読み込み時間やその他の多くの有用な情報を表示できます。

于 2009-07-31T09:06:25.340 に答える
-2

$(document).ready();ページがロードされたときに起動するため、jQuery でこれを実際に行うことはできません。

これは、Firfox 用のYSlow Firebugプラグインで行うことができます。これをすべてのブラウザーで機能させたい場合は、サーバー側のコードを追加して、最初の要素が一番下の要素に書き込まれるまでにかかった時間を表示する必要があります。

それが望ましくない場合は、Seleniumopenなどのツールを使用して、から の終了までの時間をキャプチャするテストを作成できますwaitForPageToLoad。Selenium はすべてのブラウザで動作します

于 2009-07-31T09:07:13.280 に答える