15

Javascript で CommonJS スタイルに従う RequireJS やモジュール ローダーなどの AMD ソリューションに関する記事をたくさん読みました。

この部分に分割されたアプリがあるとしましょう:

  • 私が使用するフレームワークに依存するアプリ定義
  • アプリの定義とフレームワークに依存するモデル 1
  • アプリの定義に依存するモデル 2、モデル 1 と私のフレームワーク

各パーツを RequireJS モジュールまたは一般的な JS モジュールとして記述し、プロジェクトを必要な数のファイルに分割することもできますが、各パーツをモジュールとして記述したり、多くのファイルに分割したりして、正しい順序でロードする利点は何ですか (依存関係の問題を回避するために) HTTP リクエストを減らすために (r.js オプティマイザーによって行われるように) すべてのファイルを大きなファイルに連結する可能性がありますか?

4

1 に答える 1

11

私の意見では、かなり重要な理由が 3 つあります。

グローバル名前空間を汚染することなく、モジュールを作成して再利用できます。グローバル名前空間が汚染されているほど、関数/変数の衝突の可能性が高くなります。つまり、「foo」という関数を定義し、別の開発者が関数「foo」を定義すると、関数の 1 つが上書きされます。

コードを個別のフォルダーとファイルに構造化すると、requirejs が必要に応じてそれらを非同期にロードするため、すべてが機能します。

本番用にビルドできます。RequireJS には R.JS と呼ばれる独自のビルド ツールが付属しており、JavaScript モジュールを単一 (または複数) のパッケージに連結して醜くします。これにより、ユーザーがスクリプトを呼び出す必要が少なくなり、コンテンツを読み込む必要がなくなるため (JS が醜いため)、ページの速度が向上します。

次の簡単なデモ プロジェクトをご覧ください: https://c9.io/peeter-tomberg/requirejs (in cloud9ide)。

モジュールを単一のアプリにビルドするには、requirejs npm パッケージをインストールして、コマンド r.js -o build/build.properties.js を実行するだけです。

ご不明な点がございましたら、お気軽にお問い合わせください。

編集：

開発では、すべてのモジュールを個別のファイルに入れることは、コードを構造化および管理するための良い方法です。また、デバッグにも役立ちます (たとえば、「scripts.js 行 5373」ではなく「Module.js 行 17」のエラー)。

本番環境では、ビルド ツールを使用して、javascript を単一のファイルに連結および uglify する必要があります。これにより、リクエストが少なくなるため、ページの読み込みが速くなります。何かをロードするリクエストを行うたびに、ページが遅くなります。ページが遅いほど、Google が与えるポイントが少なくなります。ページが遅いほど、ユーザーはイライラします。ページが遅いほど、売り上げが少なくなります。

Web ページのパフォーマンスについて詳しく知りたい場合は、http://developer.yahoo.com/performance/rules.htmlをご覧ください。

于 2012-08-19T00:47:26.690 に答える