CommonJSとAMD規格の理解

CommonJS(CommonJSは規格であり、Node.jsはこの規格の実装である)

JavaScriptの動作仕様を定める規格であり、任意の環境でJavaScriptが動作するように設計されている。主にサーバーサイドのモジュール管理に関する規則を提供し、Node.jsはこの規格を採用している。 基本概念 ファイル一つがモジュールに対応し、依存関係のモジュールはrequireメソッドを使って同期的に読み込む。公開するインターフェースはexportsまたはmodule.exportsを使って定義する。

require("module");
require("../file.js");
exports.doStuff = function() {};
module.exports = someValue;

利点:サーバー側でのモジュール再利用が可能。NPMには約20万のパッケージが存在する。

欠点:モジュールの読み込みは同期的に行われるため、読み込み完了まで次の処理を実行できない。つまり、必要なモジュールを必要になるまで待って読み込むため、遅延やパフォーマンス、デバッグ、クロスドメインアクセスなどの問題を引き起こす可能性がある。Node.jsはサーバー用途に使用され、ローカルディスク上のファイルを読み込むため高速だが、非同期読み込みが必要なブラウザ環境では向いていない。そのため、AMDやCMDといった非同期モジュール仕様が登場した。

実装例:Node.js(サーバー);Browserify(ブラウザ向けCommonJS実装)、NPMモジュールを使用可能だがビルド後のファイルサイズが大きくなる可能性;modules-webmake(Browserify類似);wreq(Browserify以前の実装);

AMD(AMDは規格、requirejsはAMDの実装)

AMDは"Asynchronous Module Definition"の略で、「非同期モジュール定義」を意味する。

ブラウザの特性を考慮して開発された規格で、依存モジュールを非同期に読み込み、事前にロードすることもできる。

主要なAPIはdefine(id?, dependencies?, factory)であり、モジュール宣言時にすべての依存関係dependenciesを指定し、factory関数の引数として渡す。依存モジュールは先に実行される仕組みを持つ。

define("module", ["dep1", "dep2"], function(d1, d2) {
  return someExportedValue;
});
require(["module", "../file"], function(module, file) { /* ... */ });

利点:ブラウザ環境において非同期でモジュールを読み込める;複数のモジュールを並列で読み込める。

欠点:開発コストが高く、コードの可読性や記述が難しい;モジュール定義の方法が直感的ではなく、妥協的な実装である。

実装例:RequireJS;curl;

元記事:https://zhuanlan.zhihu.com/p/26625636

タグ: CommonJS AMD Node.js RequireJS モジュール管理

6月1日 23:17 投稿