2009-07-08 21 views
3

はFirebugののネットタブから、このスクリーンショットを参照してください:読み込み時間

http://www.scdi.org/~avernet/try/firefox-times.png

私がいることを知っている:1と2の間の時間が私のにかかった時間である

  • appを使用してHTMLを生成し、データをブラウザに送信します。
  • 3から4の間の時間は、DOMContentLoadedで動作する私のJavaScriptの初期化コードがかかる時間です。

しかし、2と3の間の時間はどうなりますか?それはFirefoxがページを「レンダリング」するのにかかる時間ですか?この場合、かなり重要です(約1.5秒)。その部分を最適化する方法?

+0

あなたはスクリーンショットを添付するのを忘れたと思います。 – MitMaro

+0

画像がありません。今はいいですか? – avernet

答えて

2

2-3の間の時間は、ブラウザが1-2の間でダウンロードされたファイルの内容を解析してレンダリングすることです。これには、すべてのHTMLとインラインCSSまたはJavaScriptが含まれます。これを短くする最も簡単な方法は、1)ブラウザーが解析するデータ量を少なくして送信する、2)HTML/CSSが検証すること、3)本当に遅いCSSルール/式を監視することです。

一般的に、ほとんどの人は、ブラウザがページを完全にレンダリングするのにかかる時間に焦点を当てるのではなく、クライアント側でレンダリングを開始する時間を重視します。一般にプログレッシブレンダリングと呼ばれ、ページ全体がレンダリングされる前にブラウザがページの一部を表示することを可能にします。これが起こらない最も一般的な理由の1つは、完全に解析されるまで、ブラウザがページをレンダリングできないようにするページのコンテンツを置くことです。 This postには、これを行う方法に関するちょっとしたヒントがあります。あなたはおそらくYSlow Firefoxの拡張機能を見たいと思うかもしれません、それはあなたにあなたのウェブサイトをより速くする方法に関するいくつかのまともなヒントを与えることができます。

+0

「2〜3の間の時間」はブラウザがページをレンダリングするのにかかる時間であることを確認してくれてありがとう。 – avernet