Treehouse

Using Pub Sub with The Dojo Toolkit

By on  

As I've stated many times, the Dojo Toolkit is probably the most complete JavaScript toolkit out there, especially when it comes to event management and application communication.  I've already done a very brief introduction to dojo.connect so I thought I'd also do a short introduction to Dojo's other event system:  pub/sub with dojo.publish and dojo.subscribe.

The publish/subscribe strategy has many advantage over basic event connectivity:

  • No reference to another object or element is required
  • It's not the concern of the publisher who subscribes
  • As a result of not needing reference to another object or element, your code is instantly more portable

So let's take a look at how pub/sub is used!

Publishing

The first part of pub/sub is publishing to a channel.  When publishing to a channel, you provide the channel name and arguments to be passed to any subscriber:

// dojo.publish("{channel}", [arg1, arg2, arg3]);
dojo.publish("/app/login", [username, userData]);

Arguments should be passed within an array and may be of any type.  Your channel can be any number of channels deep; the more specific the channel, the more specific your event can be.  While the slash is used as the standard channel specifier, you can use any string name you'd like.

Subscribing

dojo.publish broadcasts message but it's dojo.subscribe that that must listen for and react to the message.  You must match the exact channel name when subscribing:

// Subscribe to the same channel, accepting each argument individually
var handle = dojo.subscribe("/app/login", function(username, userData) {
	// Now do something!
	
	
	// Unsubscribe if you want
	dojo.unsubscribe(handle);
});

Note how a handle is returned from dojo.subscribe. The Dojo Toolkit does not support wildcard channel subscription, so the following will not work:

// Wildcards don't work!
var handle = dojo.subscribe("/app/*", fn);

So how is pub/sub used internally within Dojo?  One prime example is the dojo.hash method.  dojo.hash notifies you of when the window hash changes.  You can catch the hash change event by subscribing as follows:

// This is how you respond to hash changes!
dojo.subscribe("/dojo/hashchange", function(currentHash){ 
	// Do something!
});

Now you can modify AJAX-ified portions of your application when the hash changes!

What's great about pub/sub in any toolkit or platform is that it's easy to both use and code the API for.  The code and idea are both very simply yet also very powerful.  If you've got a large application that you'd like to be flexible and decoupled from individual objects, try using pub/sub -- it will relieve unnecessary complexity!

ydkjs-5.png

Recent Features

  • CSS Filters

    CSS filter support recently landed within WebKit nightlies. CSS filters provide a method for modifying the rendering of a basic DOM element, image, or video. CSS filters allow for blurring, warping, and modifying the color intensity of elements. Let's have...

  • 5 More HTML5 APIs You Didnât Know Existed

    The HTML5 revolution has provided us some awesome JavaScript and HTML APIs.  Some are APIs we knew we've needed for years, others are cutting edge mobile and desktop helpers.  Regardless of API strength or purpose, anything to help us better do our job is a...

Incredible Demos

  • CSS Columns

    One major gripe that we've always had about CSS is that creating layouts seems to be more difficult than it should be. We have, of course, adapted and mastered the techniques for creating layouts, but there's no shaking the feeling that there should be a...

  • Rotate Elements with CSS Transformations

    I've gone on a million rants about the lack of progress with CSS and how I'm happy that both JavaScript and browser-specific CSS have tried to push web design forward. One of those browser-specific CSS properties we love is CSS transformations. CSS transformations...

Discussion

    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!