web-dev-qa-db-ja.com

Googleでのページの読み込み時間ChromeまたはMozilla Firefox

ページの読み込みにかかる時間を確認する方法はありますか?

編集:

質問を少し拡張します。 ASP.NETプロジェクトで作業しており、Visual Studio内でプロジェクトを実行すると、画面上に開始ページが表示されて使用できる状態になるまでに読み込み時間がかかります。

このWebサイトがライブであった場合、ロード時間はVisual Studioからプロジェクトを開始するときのロード時間とは異なるはずです。

私が見たいのは、Webサイトがサーバー上にある場合の実際の読み込み時間です。

編集2:回答

Chrome->右クリック->要素の検査->ネットワークタブ。ページをロードすると、実際のページのロード時間、css、jsなどのロード時間を示すページのタイムライン用のNiceレポートがあります。 Mozillaの[ネット]タブの下に同様のツールがあります。

26
Anton Belev

Firefoxに関しては、opは既に彼自身の質問(メニュー-Web開発者-ネットワークまたはCtrl + Shift + K-ネットワークまたはCtrl + Shift + Q)に回答していますが、「app.telemetry Page Speed Monitorアドオン。最初にウェブコンソールを開く必要はありません。ステータスバーに読み込み時間をミリ秒単位で表示します(クリックすると詳細も表示されます)。
https://addons.mozilla.org/en-US/firefox/addon/apptelemetry/
唯一の欠点は、Facebook/Twitterボタンです。

Chrome/Chromiumについては、Andy Daviesの2番目の提案である Page load time plugin は素晴らしいです。ロケーションバーの横にロード時間を表示し、詳細も提供します。

12
basic6

また、window.performanceオブジェクト(Chrome、Firefox、およびIE9 +)。

これを試して:

window.onload = function(){
  setTimeout(function(){
    var t = performance.timing;
    console.log(t.loadEventEnd - t.responseEnd);
  }, 0);
}

詳細はこちら: http://www.html5rocks.com/en/tutorials/webperformance/basics/

7
lambinator

@ nick-rtzは深刻なテストにwebpagetestを使用しているので、ロード時間を簡単に確認したいが、devを使用したくない場合は、このChrome拡張機能が役立ちます-- https://chrome.google.com/webstore/detail/page-load-time/fploionmjgeclbkemipmkogoaohcdbig

3
Andy Davies