複数の JavaScript ファイルに対するリクエストを 1 つの http リクエストに結合するにはどうすればよいですか?
-
01-07-2019 - |
質問
この概念は私にとって新しいものです。私が初めてこの概念に出会ったのは、 YUI 依存関係コンフィギュレーター. 。基本的に、多くのファイルに対して複数のリクエストを行うのではなく、ファイルは 1 つの http リクエストにチェーンされ、ページの読み込み時間を短縮します。
これを LAMP スタックに実装する方法を知っている人はいますか?(同様の質問が既にあったのですが、 ASP固有のようです.
ありがとう!
アップデート:どちらの回答も役に立ちます...(私の担当者はまだコメントできるほどの地位にないので、ここにいくつかの別れの考えを追加します)。私も来ました 別のブログ投稿にまたがって 役立つ可能性のある PHP 固有の例を示します。ただし、David のビルドの答えを聞いて、別のアプローチを検討するようになりました。ありがとう、デビッド!
解決
さまざまな方法がありますが、最も明白な方法は次の 2 つです。
- YUI のようなツールを構築すると、必要に応じてチェックを入れたコンポーネントに基づいてオーダーメイドの一意のバージョンが構築され、ファイルを静的に提供できるようになります。MooTools と jQuery UI はすべて、パッケージをダウンロードするときにこのようなパッケージ ビルダーを提供し、可能な限り合理化された効率的なライブラリを提供します。汎用の万能ツールが存在すると確信しています。
- リクエストに基づいて多数の JavaScript ファイルを提供する単純な Perl/PHP/Python/Ruby スクリプトを作成します。したがって、「onerequest.js?load=ui&load=Effects」は、ファイルをロードして正しいコンテンツ タイプで提供する PHP スクリプトに移動します。この例はたくさんありますが、個人的にはあまり好きではありません。
私は、いかなる種類のスクリプトを介して静的ファイルを提供することも好みませんが、10 個の HTTP リクエストのコストをかけずに、10 個程度の個別の小さなクラス ファイルを使用してコードを開発することも好みます。そこで、最も一般的なクラスと関数をすべて組み合わせて、project.min.js のような 1 つのファイルに圧縮し、運用環境でこのファイルを含むすべてのビュー/テンプレートに条件を持たせるカスタム ビルド プロセスを思いつきました。
編集 - 「カスタム ビルド プロセス」は、実際には非常に単純な Perl スクリプトです。引数として渡した各ファイルを読み取り、新しいファイルに書き込みます。オプションで全体を渡します。 JSMIN (すべてのお気に入りの言語で利用可能) 自動的に。
コマンドでは次のようになります。
perl build-project-master.pl core.js class1.js etc.js /path/to/live/js/file.js
他のヒント
この@に良いブログ投稿があります http://www.hunlock.com/blogs/Supercharged_Javascript.
Capistrano は、非常に人気のある Ruby ベースの Web デプロイメント ツールです。検討している場合、またはすでに使用している場合は、CSS と Javascript の依存関係を把握し、ファイルをマージし、縮小する素晴らしい gem があります。
gem install juicer
から ジューサーの GitHub ページ, を使用すると、どのファイルが相互に依存しているかを把握してそれらをマージできるため、ページ ビューあたりの http リクエストの数が減り、パフォーマンスが向上します。