I’m reviewing Angular and Knockout to determine which would fit better for a variety of upcoming projects. There are already plenty of posts out there comparing AngularJS and Knockout. I have been slowly reading through all the comparisons I could find, but unfortunately I keep running into cases where the posts are too high level, miss capabilities I need, or have errors that undermine my trust in the rest of the post.

The thing is, Knockout and AngularJS are attempting to solve two different problems. One is simply an MVVM binding framework, the other is a SPA-in-a-box solution. So instead of trying to directly compare the two frameworks, I’ve outlined the capabilities I need and will review how well each of the frameworks meets those capabilities. Where one library does not meet a particular set of needs, I’ll look at a common solution that people use with that library. Since Knockout is purely a databinding library, I expect to have to pull in others when it’s time to talk about routing, modules, and unit testing, while I shouldn’t have to do this as much with AngularJS.

Here are the capabilities I need:

  • Data binding – bind HTML elements to JavaScript data models
  • Validation – validation of raw inputs by applying rules for fields or model properties
  • Serialization – easy method for serializing models to POST to server-side APIs
  • Templating – define HTML templates for re-usable complex collections of HTML
  • Modules + DI – keep my javascript files separate, help me order them properly, manage dependencies for me
  • Automated Testing – Exploring unit testing and possibilities for higher level testing
  • SPA Routing/History – make it easy for me to route between views in a single page app, with history/deep linking

Before I dive into either of these libraries, though, I need some assurance that they will support the browsers I need, won’t get me into an odd licensing situation, and have sizable communities maintaining them. Here is a list of all the libraries I’ve incorporated in the series:

Package License Current Version Latest Update Contributors
AngularJS MIT 1.0.8, 1.2.0 rc 2 2 Days Ago 392
Knockout MIT 2.3.0, 3.0.0 beta 3 Days Ago 38
Knockout.js External Template Engine MIT 2.0.5 A year ago 3
RequireJS MIT or BSD 2.1.8 6 Days Ago 53
SammyJS MIT 0.7.4 6 Months Ago 47
Durandal MIT 2.0.0 1 month ago 27
Finch.js MIT 0.5.13 5 months ago 2
flatiron director MIT 1.2.0 4 months ago 42
$script.js ?? N/A (source) 5 months ago 8
Jasmine MIT 1.3.1 18 hours ago 49
Jasmine.Async MIT 0.1.0 1 year ago 1
Squire.js MIT N/A (source) 2 months ago 6

Latest Update + Current Version as of when I added the table row.

Browser Compatibility:

Package Browsers
AngularJS Not Documented? (extra requirements for IE8-)
Knockout IE 6+, Firefox 2+, Safari (desktop/mobile), Chrome, Opera
Knockout.js External Template Engine ??
RequireJS IE 6+, Firefox 2+, Safari 3.2+, Chrome 3+, Opera 10+
SammyJS IE 8+, Firefox 3+, Safari 3+, Chrome 5+, Opera 10+, Mobile WebKit
Durandal Not Documented?
Finch.js Not Documented?
flatiron director ??
$script.js IE 6+, Firefox 2+, Safari 3+, Chrome 9+
Jasmine, Jasmine.Async Not client facing. Supports a wide range of browsers, including PhantomJS. Chutzpah plugin for Visual Studio (no ncrunch yet though)
Squire.js Also not client facing

I’ll explore each capability in both frameworks as well as my opinions and frustrations along the way. Then when the whole series is posted, I’ll offer a final set of opinions. The plan is to post daily (weekdays) until I get to the end, so keep an eye out on the site or follow me on twitter for updates.

I haven’t actually written the last post yet, so you have plenty of time to color my opinion and point out where I did things wrong as I roll out each post :)