RequireJS を使用するサイトに複数のページがあり、ほとんどのページには独自の機能があります。それらはすべて、多数の共通モジュール (jQuery、Backbone など) を共有しています。それらにはすべて、独自の独自のモジュールもあります。r.jsを使用してこのコードを最適化する最良の方法は何だろうと思っています。RequireJS と Almond のドキュメントと例のさまざまな部分で提案されている多くの代替案を目にするので、次の可能性のリストを思いつき、どれが最も推奨されるかを尋ねています (または別のより良い方法があるかどうか)。 :
- Almondを使用して、サイト全体の 1 つの JS ファイルを最適化します。Almondは一度読み込まれ、その後はキャッシュされたままになります。この最も単純なアプローチの欠点は、ユーザーがそのページで必要としないコード (つまり、他のページに固有のモジュール) を各ページにロードすることです。ページごとに、読み込まれる JS が必要以上に大きくなります。
- 各ページに対して 1 つの JS ファイルを最適化します。これには、共通モジュールとページ固有のモジュールの両方が含まれます。そうすれば、各ページのファイルに Almond を含めることができ、各ページに 1 つの JS ファイルのみを読み込むことができます。これは、サイト全体の単一の JS ファイルよりも大幅に小さくなります。ただし、共通モジュールがブラウザにキャッシュされないという欠点がありますね。ユーザーがアクセスするページごとに、jQuery、Backbone など (共通モジュール) の大部分を再ダウンロードする必要があります。これらのライブラリは、それぞれの固有の単一ページ JS ファイルの大部分を構成するためです。(これはRequireJS マルチページの例 のアプローチのようですが、この例では Almond を使用していません。)
- 共通モジュール用に 1 つの JS ファイルを最適化し、次に特定のページごとに別の JS ファイルを最適化します。そうすれば、ユーザーは共通モジュールのファイルをキャッシュし、ページ間をブラウジングするときに、ページ固有の小さな JS ファイルをロードするだけで済みます。このオプションの中で、RequireJS 機能を含めるために、2 つの方法で仕上げることができます。Almond をまったく使用せずに、
data-main構文または通常のタグを使用して、すべてのページの共通モジュールの前にファイル require.js をロードします。<script>つまり、各ページには、require.js、共通モジュール、およびページ固有のモジュールの 3 つの JS ファイルが含まれます。b. どうやらこの要旨最適化された各ファイルに Almond をプラグインする方法を提案しています ---- そのため、require.js をロードする必要はありませんが、代わりに共通モジュールとページ固有のモジュールの両方に Almond を含めます。そうですか？それはrequire.jsを事前にロードするよりも効率的ですか?
これを実行するための最良の方法について提供できるアドバイスをありがとう。