The power of the Asynchronous Module Definition

[2011-10-14] dev, javascript, jsmodules, jslang

Update 2011-11-19: Bridging the module gap between Node.js and browsers

This post explains Asynchronous Module Definition (AMD), a standard for defining modules in JavaScript and contrasts it with the currently very popular CommonJS synchronous modules.

Currently, CommonJS-style synchronous modules are very popular. For example, they are used in Node.js. Such a module looks as follows.

    // Import new modules anywhere
    var otherModule = require("libs/otherModule");
    
    // Export your functions, classes, objects etc.
    exports.myFunction = function () {
        otherModule.otherExportedFunction() + 1;
    };

However, Asynchronous Module Definitions (AMDs) are slowly getting traction. Example:

    // Import all modules in a single location
    define([ "libs/otherModule" ],
        function (otherModule) {
            // Export your module as an object
            return {
                myFunction: function () {
                    otherModule.otherExportedFunction() + 1;
                }
            };
        }
    );

The main advantages are:

Asynchronous: AMDs have been designed to support asynchronicity and most AMD-compatible script loaders take advantage of it. Thus, AMD modules can be loaded in parallel. Once the last imported module has finished loading, the importing module can be evaluated. It is ironic that the Node.js module system is synchronous.
Work in browsers: Browser modules have to be asynchronous and AMDs are.
No globals: AMDs avoid global variables from being created, because there is always a wrapping function. Note, though, that CommonJS-compliant module loaders usually also (invisibly) wrap modules they load in a function.
No more namespacing: AMDs obviate the need for namespacing such as foo.bar.myModule, via a global variable and nested objects. The namespacing is in the path to the file, a local variable is short and convenient handle.

Two popular script loaders that support AMDs (source: [1]):

RequireJS [includes support for using AMDs on Node.js]
curl