Yuriy Dybskiy

Curious JavaScript Engineer, @html5cat

Choosing a JS MVC Framework: Angular.js vs Ember.js

tl;dr

As of late March 2013, after spending a month with each project, digging into documentation and examples available, I can say with confidence: it’s not fair to compare them. But if you really don’t have time to learn both – use AngularJS. Ember is not ready for prime time, yet.

AngularJS is a dream if you’re accustomed to HTML data- style behavior like you find as part of Twitter Bootstrap’s javascript

Some context

Year 2013 started with a great R&D project for me. The problem: existing webapp codebase had too much technical debt and it was incredible hard to add new features without regression. Solution: re-write the app using MVC framework.

Problem #2: which MVC framework to use? Solution: build a prototype using two most promising ones and decide. The app is purely client-side single page JavaScript app, talking to a few server APIs. Think simplified version of Double-Click or Google Analytics.

You might have heard or seen the talk by Double-Click team about moving to AngularJS. So have I and my gut feeling was that Angular would be a perfect fit for this project. Glancing into the future, or actually present, that assumption was spot on and it is Angular’s sweet spot type of app.

MVC framework comparison algorithm:

  1. Check out available docs, blog posts and example apps
  2. Go through Tutorial
  3. Build app prototype
  4. Rinse and repeat

How AngularJS won me over

Apart from the data-bindings and MVC awesomeness that both frameworks bring to the table, here are three things that drew me to AngularJS:

Focus on testing

AngularJS team is using Karma (formerly Testacular) to test the framework itself and go extra mile writing end-to-end and unit tests for all the steps in the Tutorial. Having testable code is part of AngularJS philosophy. Making it easy to write tests is crucial. I don’t care how good your code is – if it’s not testable, it’s useless in the long run.

App structure

It might sound like a minor thing, but if you have a team of developers working on a project, having a scalable app structure right out of the box is very helpful. Key Angular concepts translate naturally into controllers, directives, filters and services files or directories. I also like the way the app is broken into such concepts – seems very natural to me, unlike the Ember approach.

Extending HTML

Angular’s main philosophy is extending HTML syntax instead of abstracting HTML away with another templating language – Angular is what HTML would have been had it been designed for applications (from Docs/Overview)

If you are using the classical code quality measurement metric of WTFs/minute, Angular will make you happy.

What about Ember?

March was pretty rough for Ember team with a lot of angry posts about how confusing and hard it is getting started with it. Significant changes to the router didn’t help that either and the amount of up to date examples and articles was approaching 0. That being said, best way to resolve Ember questions appeared to be just reading its source code and comments there.

Here is a list of interesting posts in chronological order:

  1. EmberJS Confuses Me – by Rob Conery from Tekpub

  2. Ember: Baby Steps – by Rob Conery

  3. “GETTING STARTED WITH EMBER.JS IS EASY.” – no it isn’t – discussion on Discourse which is built using Ember

  4. MAKING EMBER.JS EASIER – response from Ember team

  5. STABILIZING EMBER DATA – another response from Ember team

  6. Ember… What If (Part 1) – by Rob Conery

Ember team is hard at work in bridging the gap of everyone’s expectations and reality of getting up to speed with the framework.

Final thoughts

AngularJS is built by Google. Google has one of the strongest engineering cultures. Combine that with the resources that they have and with the power of open source and you get a really powerful mix.

The quality of documentation is really good and there are plenty of example code and apps out there which help tremendously in getting started.

During the recent Angular meetup in Mountain View I’ve chatted quickly with the creator of AngularJS, Miško Hevery. He confirmed my assumptions that AngularJS team is in sync with Chrome Dev team and it is a very strong strategic advantage, considering interesting advances in Web Components.

Comments