9


1

JavaScriptのロード時間に適しているのは、1つの大きなファイルですべてを圧縮するか、すべてを非同期でロードするかです。

簡単な質問ですが、短い答えがあるかどうかわかりません!

説明 + JavaScriptのファイルがあります。これらのファイルをWebサイトにロードするには、いくつかのメモがあります。

  • それらはすべて同じドメインからのものです(クロスドメインの読み込みはありません) 必要)

  • それらはウェブサイト全体で同一です。

  • jQueryのようないくつかのファイル、および他の5つのプラグインに加えて独自のファイルがあります それらに基づいたアプリケーションスクリプト。

  • それらのサイズはすべて圧縮= 224KB、(すべてのファイルを1つに結合します ファイルし、YUI Compressor 2を使用して一度に圧縮します

問題 + 224KBは1つのファイルに収めるのが理想的ではないと聞いたことがあります。 そして、それぞれ最大44KBの複数のファイルに分割する必要があります。 これを聞いたときに思い出せず、それをより多くのファイルに分割するのが効果的かどうかわかりませんが、224KBが初めてロードするのに時間がかかることは事実です、ウェブサイトに画像がロードされていることを考慮してくださいもちろん、CSS。

JavaScriptファイルの早期ロードの必要性を最小限に抑えて、最下部に配置しました。これまでのところこれは良い進歩ですが、時間を稼ぐためにHTMLと非同期にロードする必要がありますhttp://blog.sidneidasilva.com/ 2010/10/01 / even-faster-web-sites-with-yui / [ソース]とする決定は次のとおりです。

*はいまたはいいえ?+ 1つの大きなファイルに圧縮して保存しますか? または、それらを多くの圧縮ファイルに分割し、非同期にロードします(依存関係に関連する問題を処理することを知っています)?

4 Answer


6


それはサイトが何であるか、そして最初の読み込み時間がどれだけ重要であるかに依存します。

それにもかかわらず、私はおそらくJQueryとそのようなものをパブリックCDNからロードするでしょう。 大きな利点の1つは、サイトにアクセスしたことがない場合でも、既にキャッシュされている可能性があることです。

カプチーノチームは1つのファイルの大きな支持者です。彼らはjavascriptフレームワークを作成します。 ツールを使用して作成されたアプリには、ある程度の読み込み時間が必要です。


4


JQueryをロードし、パブリックCDNから関連することのもう1つの利点は、宛先ごとのリクエストが増加することです。 クライアントはドメインごとに2つのリクエストに制限されていると思われるので、Googleからjquery、jqueryからプラグイン、独自のドメインからカスタムアプリコードをロードすることにより、ブラウザは最初の2つを待ってからこれらを同時に実行できます3番目の要求を発行します。

これにより、1つの大きなファイルのパフォーマンスがさらに向上します。 その1つのファイルを2つに分割しただけでも、ブラウザーからの2つの同時要求で取得でき、ロード時間を改善できる可能性があります。


3


以下は、Webアプリを高速化するために行ったことです。

メインのJSファイルとCSSファイルは圧縮され、HTMLマークアップとインラインに配置されます。 + HTMLの空白は削除され、画像はシェルスクリプトによって `data:image / png`に変換されます。

サイズは約400kbですが、キャッシュされ、gzip圧縮されています。 +ウェブアプリのモバイルバージョンは同じですが、最大250 kbです。 これは、実行可能ファイルのように、1回のhttp呼び出しでアプリ全体を実行する準備ができたことを意味します。

次に、2番目のhttp呼び出しでdata(JSON)を取得し、http://beebole.com/pure [PURE]を使用して、ページ内の既存のマークアップをテンプレートとして使用してHTMLでレンダリングします。

アプリはモジュールに分割され、共通のモジュールのみがこの方法でプリロードされます。 +他のユーザーは、ユーザーの要求に応じて来ます。


2


この質問に対する正確な答えはありません。 これらのファイルをいつどのように使用するかに大きく依存します。

通常、Webアプリで一般的に必要とされるページロードでJSファイルのみをダウンロードします。 モジュール固有またはページ固有のJSファイルは、メインのJSダウンロードで圧縮されるべきではなく、理想的にはオンデマンドでロードされます。

また、この質問は、初めてのユーザーのユーザーエクスペリエンスが心配な場合にのみ有効です。 とにかくJSファイルは、他のすべての訪問でキャッシュされます。