Dojo 1.7 now supports AMD

January 19, 2015 •  AMD •  dojo •  frontend •  javascript •  js •  modular



As of  Dojo 1.7 , it fully supports AMD (Asynchronous Modular  out of the box, now you ask what's AMD , well according to addy osmani's blog, AMD is a cool way of writing Modular JavaScript rather than the typical packing all Objects and functions in a single JavaScript Source File.

AMD gives you the structure of decoupling your objects into modules, to be quite frank its a lot more than that, but this article won't jump into that for now,  AMD allows you to actually import the necessary part  you really need.

Dojo and AMD

Dojo Toolkit  has converted most of its packages to AMD Compliant, looking into the source code you can see the AMD api in it "define" and "require", however you can still make use of the legacy synchronous mode "dojo.require('dijit.form.Button')" but as of Dojo Toolkit 2.0 it will deprecate support for the Legacy Synchronous Mode.

Example of Dojo AMD and Non AMD Codes

Event Handling

Dojo 1.6 Base comes with a lot of tool-sets, the parser,connect, and some other functions however when using 1.7 in async mode, you need to require the packages to be used, in order to get Developers to catch up with recent changes and usage of 1.7, Dojo has provided the Dojo Documentation which can be downloaded online, the new documentation runs all codes offline without an online connection.

// Dojo 1.7 (AMD)
require(["dojo/_base/connect"], function(connect){
  connect.connect(obj, event, context, method, dontFix);
});
// Dojo < 1.7

 dojo.connect(obj, event, context, method, dontFix);

Dom Manipulations

//Dojo 1.7
require(["dojo/dom-style"], function(domStyle){
domStyle.get(node, style);
domStyle.set(node, style, value);
});

// Dojo < 1.7
dojo.style(node, style, value);

Body Document

//Dojo 1.7 AMD
require(["dojo/_base/window"], function(win){
  console.log( win.body() );
});
[ Dojo < 1.7 ] console.log( dojo.body() );

AMD is quite an interesting way of writing JavaScript, it is the future of writing the Next Generation JavaScript.


Post Comment