Firebug を使用して、ページの読み込みが遅い原因を特定するにはどうすればよいですか?

Question

私は、複数のスクリプト、CSS ファイル、動的に生成された多数の HTML、スクリプトを読み込むスクリプト、その他あらゆる種類のクレイジーなものを含む複雑なページに取り組んでいます。当然のことながら、ページの読み込みが非常に遅くなることがあります。

正確に何が速度を低下させているのかをリアルタイムで判断するのは難しいと感じています。できる ファイアバグの「ネット」タブが役に立ちますか?もちろん「ネット」タブを見てみましたが、ファイルしか表示されていないようです 後 それらはロードされています。他に役立つツールはありますか?私が望むのは、ページがまだ読み込まれていることを確認し、何がまだ読み込まれているかを正確に確認できるようにすることです。

FireFox のステータス バーは少し教えてくれます...「www.mydomain.net を待っています」と表示されますが、どのファイルを待っているのか正確にはわかりません。ここでボトルネックとなっている 1 つのファイルがあり、それが後続のすべてのファイルの読み込みをブロックしているのではないかと考えていますが、正直に言うと、ブラウザがファイルをフェッチする仕組みの詳細についてはあまり知りません。

Answer 1

その場合の最善の策は次のようなものになります バイオリン弾き (スタンドアロン プログラム)、 データの改ざん, 、 または ライブヘッダー (どちらも Firefox プラグイン)。

それぞれの場合、受信した HTTP リクエストを確認できます。これらにより、何がリクエストされているかがリアルタイムで表示され、何がサイトをハングさせているのかについてより詳しい洞察が得られるはずです。幸運を！

Answer 2

Firefox用の YSlow というプラグインが役立ちます。

Answer 3

[コンソールタブ-プロファイルをクリック] ...これは、どの機能が低速で実行されているかを特定するのに役立ちます。

FirebugのYSlowアドオンも強くお勧めします。キャッシュやgzip処理から、速度が低下する可能性のあるHTTPリクエストの数まで、多くの問題を診断するのに役立ちます。

Answer 4

Google Page Speed もあり、同様のことが行われますYSlowに追加します。

Answer 5

ページの読み込みが完了するまで待つと、Firebugは[ネット]タブに時間がかかったファイルを表示します。

Firebugが現在読み込んでいるすべてのファイルを表示することは素晴らしいことであることに同意します。

Answer 6

複雑なものには改善の余地があるはずです。 私はFirebugの専門家ではありませんが、実行を一時停止して、実行内容とその理由を確認できますか？それを数回行うと、本当に必要のない時間支出を見つけることができるはずです。