Ask HN: AngularJS vs Backbone vs Ember? | Hacker News Reader

Ask HN: AngularJS vs Backbone vs Ember?

25 pointsgawker21 comments

Hi guys,

I'm starting a new project and am wondering what are the pros and cons of each framework over the other?

Thanks!

Angular beats Backbone like a prison rape scene. I wrote the peepcode backbone todo app in 1/3 the code using angular (over here: https://github.com/ludicast/angular-peepcode-todo, n.b. I haven't had time to update to newest Angular)

Haven't used ember, but I do mancrush ykatz, so sure he is taking it to good places.

You first need to consider what kind of framework you want.

Backbone is a very light MVC framework that provides you a few minimal tools for structuring your project. It doesn't get in your way, and it won't have any performance issues. On the other hand, it doesn't hold your hand, and it doesn't help you solve any especially hard problems. A simple demo app tends to look very clean when implemented in Backbone, but anything more complicated will require you to write a TON of code. (By design; Backbone only provides functionality that everyone will need, regardless of the type of project.)

The other two you listed are heavier, and more opinionated. They will do a lot more to help you, if you're working the way they think you'll work. If you aren't, they can be counter-productive; it's not hard to miscode something to get a major performance penalty.

I evaluated every framework I could get my hands on, and settled on Knockout. It's quite similar to AngularJS and Ember, but feels more mature than either, and has great documentation. Its killer feature is it's two way bindings between the DOM and the JS models.

My project is basically a very complex CRUD app; I've got tons of complex, deeply nested records I need to display and let users edit; a good, fast, clean UI for doing so is crucial. My initial spike using Backbone bogged down in endless boilerplate to try and keep everything in sync, and tons of ugly JQuery code to manipulate the DOM. (And was buggy to boot, which I'm sure was my fault, but highlights that Backbone can have a somewhat rough learning curve.) Knockout, however, made it a snap. My code was shorter, cleaner, easier to write and maintain, and fast.

So, my suggestion: Backbone if you're comfortable with writing all the functionality you need from scratch, and just want a little structure for your app. On the other hand, if you want a very robust framework for writing CRUD apps with a rich UI, and want to make your life easy, go with Knockout.

(Ember and Angular are good too, but in my view they're too similar to Knockout. There's just no compelling reason to choose them, given that Knockout is more mature and polished.)

AngularJS has very many similarities with Knockout, except the templating vocabulary is completely extensible (you can create components by creating new HTML elements and modify behavior of existing elements using custom element attributes).

Also in contract to KnockoutJS, AngularJS doesn't require any special wrappers for your model (no ko.observable() all over the place), which means that it's less intrusive and allows you to create models the way you want them to be (need a native array, primitive or custom type? no problem).

You can have both: there's a Backbone/knockout lib called Knockback, which supposedly brings the best of both worlds, although it seems a little intrusive.

Our front-end team did extensive research on this that wrapped up a just a couple days ago. They landed on angular and have been very happy. I'll see if I can get one (or more) of them to comment on their findings.

In order to make a reasonable choice between js MVC frameworks, the best is to write on your own a small app and decide for yourself. During my research, I have the following chart. 1. JavascriptMVC 2. AngularJS 3. Backbone All the rest (Ember, Knockout, Dojo) aren't nearly close to the 3 winners. Backbone and Angular were described quite good. So, I'll add what I've loved about JavascriptMVC (JMVC) and what problems it solves out of the box: Problem 1: How to structure the project? Where are 100+ variants to structure the folders of the project. It's important when is grows. JMVC has automatically generated empty project with very clean structure: separate folder with models, and separate folder per module for controllers and views. Problem 2: AMD AMD is built in into JMVC Problem 3: jQuery support JMVC is built on jQuery, so no collision happens what so ever Problem 4: Documentation JMVC has plenty of ot including API description, tutorials and active community Additional sugar: It has built it google closure compiler and minifier and checks your js code and optimize it; It has built in documentation script that generates documentation out of comments. Thus, JMVC is not just an Javascript MVC framework, it's great set of tool for the development of serious heavy apps.

Angular is fast and easy for development. Very ittle boiler-plate and comes with easy UI bindings. I feel it's perfect for smaller projects where separation of logic isn't as important. Angular has the ability to grow in complexity if you need it too.

Backbone comes with a lot of boilerplate, but honestly is worth it if you have a larger front end app. Being able to have your data trickle though your models and views in a concise structured way can make changes as well as fixes much easier in the long run. Backbone's persistence functionality is pretty phenomenal as well.

Ember relies pretty heavily on Handlebars. If you're game to use that for your client side rendering than it could be a good option. Ember looks similar to Backbone but makes a few things easier such as computed properties and bidirectional bindings. I haven't touched it much yet as I'm currently working in Backbone and Ember's current lack of an "official" persistence mechanism turned me off a bit.

All three of these are great frameworks. Angular is easier to pick up but Backbone has more users and more users means someone has probably ran into a problem that you possibly will and has already asked a question on StackOverflow. That alone can be invaluable.

I have the same problem at the moment. I think I'll do backbone and move to Ember. I remember reading somewhere the google people is saying AngularJS is their experiment, so lots of things might get deprecated or change. I wouldn't bank on it if its pace of changes is crazy.

AngularJS v1.0 was released couple of weeks ago. There are too many internal apps at Google to break the API, so I wouldn't be afraid of this.

I'm interested in this too, I did find a blog post which does some comparisons: http://codebrief.com/2012/01/the-top-10-javascript-mvc-frame...

Thanks a lot - that link was really helpful!

I was reading through AngularJS and was utterly confused - it sounds a bit too complexed for my needs at the moment.

Really? Have you watched any of the videos on the http://angularjs.org/ home page? Or taken our awesome tutorial: http://docs.angularjs.org/tutorial

One of the design goals of AngularJS is to be as close to HTML and browser as possible - picking the good parts and enhancing it for building web applications.

I'm very excited to try Angular. Your tutorial, however, is not compatible with the suggested server experience where Apache is not installed, as Node has updated to v0.8 and not only deprecated but removed the "sys" module in favor of the "util" module. Update your repos please? https://github.com/angular/angular-phonecat/pull/18 https://github.com/angular/angular-seed/pull/22

Not digging against you, but this might (though, imho it shouldn't) be a barrier to entry to newcomers. I've simply resigned myself to editing the one line it takes to complete the tutorial every step of the way... Though in retrospect I think I probably could have just forked it and updated that line myself for a permanent fix... :)

Will get this fixed ASAP. Node 0.8 is only ~1 week old ;-)

Sorry, Igor. I jumped the gun with that post and have managed to develop my app in a few days :)

I thought the documentation is pretty excellent. The tutorial did help with some of the concepts but it could be that my project requirements are different and so I didn't find it entirely helpful :)

That said, I found the cookbook to be helpful although it seems like it's not linked anywhere from the homepage?

That post is unfortunately incorrect. The author claims that AngularJS doesn't have "composed views" which is very unfortunate because out of all the frameworks he listed Angular's component composition model is by far the best, he just didn't bother to investigate it despite several users pointing out the error in the discussion under the post.

It also mentions that "asynchronous UIs" (ie, optimistic save: server callbacks don't block, if something bad happens you'll solve it in a callback) need some sort of operational transformation (think google wave), but I think this only applies if you are writing real-time multi-user apps (chats, google docs, etherpad, etc) which is the overwhelming minority of mobile apps.

Thanks for the comments, guys. I've just experimented with AngularJS and have managed to build most of what I need in less than a week.

As a side project, I might attempt to work with the other frameworks as a comparison.

I find AngularJS the best.

vs Knockout?

Knockout is great. I've been using it heavily for the last year.

Reply on news.ycombinator.com