Categories: JavaScript

I’ve been working with Durandaljs for a few weeks now.  It’s an open-source single page application (SPA) framework written to use technologies that you might already know.  So far, I’m really impressed and I’ve enjoyed working with it.  Since I already do a fair bit of Knockout development, I like the fact that Durandal uses KO and several other things I know such as Requirejs.

I’ve made SPA-like parts to web apps before but I always found it hard to manage all of the bits and pieces that go together to make an app.  For example, modal dialogs were typically a pain to implement.  In Durandal, it basically handles the management of the modal’s appearance and how its view is retrieved and dynamically bound to the view model that you create.  The development of a Durandal app basically goes like this:

• Break up your app into views with complementary view models (the views are HTML files with KO bindings and the view models are just JavaScript classes or object literals).  The view model is written as one RequireJS module.  The modularity of your application is one of the great strengths of this framework and really is more of a RequireJS thing than a Durandal thing.  But Durandal does tie all of it together so think of it as a coordinator between libraries rather than its own implementation. 
• You then setup your navigation and routing.  Currently, Durandal is route-engine agnostic and supports a plug-in model to support routing.  It ships with a SammyJS-based routing engine which is pretty easy to use.  This is one area that I personally lacked some knowledge in, but SammyJS is pretty easy to learn to do most common tasks.
• Once you get views and view models together, you can move on to advanced stuff like view composition and eventing in Durandal.

I think one of the biggest strengths of Durandal is that it has a very powerful view composition system.  This basically allows you to find views, merge them with a view model and inject them into your DOM with ease.  You can use composition to swap out or render sub-sections of a page (such as a tab content area) or you can even do awesome things like recursive composition to build tree views or menus with sub-menu capabilities.

If you are a Pluralsight member, I suggest checking out John Papa’s course on SPAs where he talks about Durandal (and many other aspects of SPAs). 

The only bad part so far for me is that I wish I had known about this framework six months ago to use it in my current project.  I am currently thinking of refactoring to using Durandal.

No Comments