Knockout vs JavascriptMVC vs Backbone

“I asked Matt if it was ok to repatriate this article since his blog is now offline (will be back soon), Backbone is not portrayed in a good manner here, but I can understand his frustrations and found his point of view interesting” – Cedric Dugas

Recently we had a project that called for heavy Javascript interface. Awesome! A chance to try out some of these new fangled Javascript frameworks; namely Knockout, JavascriptMVC, and Backbone. The project’s UI would have to respond to many different events across many nested templates. It would also have a fair amount of objects that would need to be synced to the backend when they were updated.

Disclosure: I’m a server-side guy. I went from PHP to Rails over the last 10+ years. I’ve avoided Javascript successfully until jQuery lowered the bar so far that I could heft my unwillingness up and over.


My first foray into Javascript frameworks was Knockout. Knockout has the nicest site so I chose it first (you do it too). Knockout felt really great at first. It made sense. It sells the fact that when an attribute in your view model changes, your UI refreshes automatically. To be clear, all three frameworks do this. Anyhow, Knockout was going well enough, but I did have some issues getting my Javascript ‘classes’ to mix in with Knockout’s view model. It wasn’t horrible, and quite honestly, it could have been a learning curve issue, but things rarely worked the way I’d assumed. Knockout is really just a MVVM (Model View View-Model) design pattern implementation and deals with the UI. It has no built-in way to structure/load/save your objects back to a REST interface. Knockout solves half our needs, so we moved to JavascriptMVC.


JavascriptMVC (JMVC) is a robust (heavy) framework that does everything from giving you an opinionated way to structure your Javascript code, to generating it for you. The framework adds 20M+ to your public folder as a result. This isn’t a huge issue, but it nearly doubles the Heroku slug size my existing Rails backend uses. EDIT: I misspoke here. According to Justin Meyer, the author of JMVC, the framework is actually quite small (7KB). I downloaded the entire project (including tests, documentations, etc.) and dropped it into my project.

JMVC provides a clear way to CRUD your data and test it, and has a bunch of decent documentation and tutorials. What turned me off was that it’s super heavy. My gut feeling is that when one project solves too many problems, it doesn’t do them well. From the sheer amount of stuff it generates and perusing the documentation I honestly got overwhelmed. I thought, hell, if I’m learning their way, why not learn it from the ground up and really get a good feel for it? This is also the same principal that kept me on Slackware until 2005 — but is also the reason I’m at home on the command line.


I’ve heard about Backbone.js from a bunch of people and it was my first thought when it came to this project. I guess I saved it to last as it was the most bare bones implementation of a Javascript MVC stack; the very reason I now turned to it. Backbones has a decent amount of streamlined documentation and a few live app examples. For the first twenty minutes I missed their underscore.js dependency and sat there staring at a super obscure Javascript error that had nothing to do with the missing dependency. After a Twitter buddy nudged me in the right direction, I was on my way — for about five minutes.

I started a simple Todo List app that was meant to be a quick learning exercise. Creating Backbone Models and Collections was a snap. Creating a View was less than straight forward. Is their View a View-Model? Are you supposed to have one large View and many sub-views (templates)? The frustrating part was that all examples on the web showed many ways to use a View — and none of them worked for me.

I sat back and thought to myself that I was biting off too much at the first pass and that I would work my way through one of their example apps. I typed it all up, then clicked refresh on the page. It erred out. I double checked everything. The error was something like “undefined blah blah in underscore.js on Line 8”. Not exceedingly helpful — especially to a beginner. I even went so far as to directly copy the app and its templates. It failed to run.

I gave up.

I think these frameworks are a great idea, and something like them are going to be a necessity as the web matures, but they introduce a whole slew of their own issues. If I had to use one today, I would recommend JMVC. It’s the most mature of the three projects and it shows.

I’d like to see a mixture between Knockout and JMVC rolled together like ActionView, ActiveRecord, and ActionController in Rails. Backbone would fill Sinatra’s slot as the barebones implementation. Who wants to make the first MVCMVVM framework? You (and the Romans) could call it “2915”.
Some stats:

Fatal error: Uncaught exception 'Exception' with message 'Make sure you are passing in the correct parameters' in /home/posabsolute/webapps/backbonefu/wp-content/plugins/add-local-avatar/TwitterAPIExchange.php:45 Stack trace: #0 /home/posabsolute/webapps/backbonefu/wp-content/plugins/add-local-avatar/avatars.php(173): TwitterAPIExchange->__construct(Array) #1 /home/posabsolute/webapps/backbonefu/wp-content/plugins/add-local-avatar/avatars.php(1393): add_local_avatars->get_twitter_avatar('mattdarby') #2 /home/posabsolute/webapps/backbonefu/wp-content/themes/premiumpixels/single.php(47): get_avatar() #3 /home/posabsolute/webapps/backbonefu/wp-includes/template-loader.php(75): include('/home/posabsolu...') #4 /home/posabsolute/webapps/backbonefu/wp-blog-header.php(16): require_once('/home/posabsolu...') #5 /home/posabsolute/webapps/backbonefu/index.php(17): require('/home/posabsolu...') #6 {main} thrown in /home/posabsolute/webapps/backbonefu/wp-content/plugins/add-local-avatar/TwitterAPIExchange.php on line 45