
Ember.js or Angular.js? - codygman
Which is best overall? Which is best in certain common situations? Which is most enjoyable? Which is more maintainable? Why not ember? Why not angular? What are common "gotchas" for each framework?
======
flog
I've used SC before it was Ember, hated it. I've been using Angular for a few
weeks - LOVE it. It's amazingly quick to build great stuff.

I was on a Skype call with my UX designer the other day talking about how we
should display a permissions list: we sent back and forwards a few different
sketches, by the time we finished discussing the final sketch I had
reimplemented the modal as a radio button, disabling and hiding the checkboxes
when the first radio was clicked... at which point I thought, "shit, that
would have usually taken 15 minutes to do".

~~~
rxcfc
Ember has changed quite a bit from its SC roots. I would probably use Angular
over SC myself, but if given the choice to use Ember would much rather use it.

------
shad0wfax
I think deciding on this will be hard and frankly subjective. My suggestion is
that you try both for a small project and decide for yourself what makes you
feel at home. It should not take more than a couple of days to assess it
yourself.

As for me, I decided to go with Ember.js. To be frank the final decision was
between Ember and Angular (over all other frameworks) and I felt that getting
past the learning curve of Ember, it made me comfortable. Most importantly
both are close/past the 1.0 release.

If you do choose Ember, I would recommend the following:

\- Watch the peepcode's emberjs cast <https://peepcode.com/products/emberjs>
(and code it up)

\- Go through the Emberjs documentation on the site, though very likely you
will not know how to build a big app. It is still necessary to hone your
fundamentals.

\- The 1.0 RC1 that was released yesterday has dependency injection, if that
matters to you. My opinion is to just code as little as possible and prefer to
stick with the framework's conventions (i.e not use DI).

\- Use a sound build tool. I don't have Ruby/RoR background and so preferred
to use Brunch.io (<http://brunch.io/>) - Nodejs pipline. They have a Emberjs
skeleton available to get started quickly - <https://github.com/icholy/ember-
brunch>. I believe there is a rake pipeline tool for Ruby/RoR folks as well.

\- Ryan Florence recently released a scaffolding/build tool Emberjs -
<https://github.com/rpflorence/ember-tools>. I use this to develop my
skeletons and use it with my Brunch.IO setup. It is a good place to start and
get past the learning curve. The tool will probably become the go to place for
building Emberjs apps sometime later.

I am sure you will find similar tools for Angular.js but I think you just have
to try something simple in both and find out for yourself what makes you
comfortable with these opinionated frameworks :).

~~~
eduardordm
Your comment is among the sanest in this thread, thanks.

The single most important thing you said is: "It should not take more than a
couple of days to assess it yourself."

If you are a serious web developer, you should know the basics of both, they
are both great in their own way. Every project have its own requirements and
sometimes both libraries will not be suitable, sometimes you will want to go
with backbone or something else.

I would recommend going to peepcode.com and egghead.io before jumping into the
docs.

I will just leave this here and bail out: I have a hunch ember.js will become
a default in RoR by the end of this year.

~~~
atomical
What do you mean by default?

~~~
jlogsdon
It will be a part of the generated Gemfile, much like coffeescript is now.

~~~
atomical
It seems unlikely based on the views of rails core.

------
codygman
I have limited experience with javascript and MVMM's and cannot answer all the
questions, but here is what I do know:

Which is best overall? Not enough experience with ember.js to comment.

Common gotchas for angular: It's a very different approach when compared to
using jquery for everything. The documentation can seem a bit daunting at
first, as described in the popular post about why discourse chose ember.js.

"The documentation was simple to understand

Here’s some text right out of the Angular.JS guides, about a feature called
Transclusion.

'The advantage of transclusion is that the linking function receives a
transclusion function which is pre-bound to the correct scope. In a typical
setup the widget creates an isolate scope, but the transclusion is not a
child, but a sibling of the isolate scope. This makes it possible for the
widget to have private state, and the transclusion to be bound to the parent
(pre-isolate) scope.'" - [http://eviltrout.com/2013/02/10/why-discourse-uses-
emberjs.h...](http://eviltrout.com/2013/02/10/why-discourse-uses-emberjs.html)

A lot of these problems are solved by the excellent tutorial videos at
<http://www.egghead.io> though. I have no affiliation to the site, but it has
made a ton of things about angular more clear for me.

Hope this helps!

~~~
nkerkin
Ha ha, nice way to scare people off angular and justify their decision ;)
Transclusions are an interesting feature to cherry pick because a) they're a
necessary complexity to enable reusable components (one of angular's greatest
strengths), and b) they highlight the steep learning curve required to truly
master angular.

I agree that the docs can be a bit vague occasionally, but I think that's only
due to the sheer depth of features and flexibility that angular provides. I
was a skeptic for a long time (was championing knockout.js), but having used
it in both personal and professional projects, I'm a convert.

Angular is a thoroughly well designed library, that gets the hell out of your
way.

~~~
codygman
I wasn't _trying_ to scare people off of angular, as it's what I am currently
trying to use. I find it to be a very good framework, but also plan on
checking out ember.js to see if it provides more for me overall or not.

~~~
nkerkin
Yeah, sorry, was referring to the discourse article, not meaning to implicate
you.

------
dronacharya
I haven't used ember.js, but have been getting my teeth into angular.js over
the past couple of months. Overall, I've been very happy with it.

What I liked:

\- Relative simplicity and very little code for most common tasks
(showing/hiding content, AJAX and JSON support, breaking down the UI into
components / areas).

\- Great testability, thanks to relatively clean separation of concerns.

\- The two way databinding support is awesome and works well. This does away
with lots of the usual boilerplate.

\- Templating is very straightforward.

\- No performance issues to report. But from what I can gather, Angular a bit
like the Swing framework - it's possible to shoot yourself in the foot and
write poorly peforming applications. (Haven't managed to do that yet ;))

What I'm struggling with:

\- Working with directives is complicated. They are the only way you can
integrate with other javascript components sanely. Specifically, I ran into
some issues with how to make the databinding work between directives. Still
wrapping my head around how that bit works.

\- It took a while before I was able to get my unit tests up and running (most
example test suites were out of date with the current way of doing things)

\- I have some (minor) issues with how things are named. There are two kinds
of 'Controllers', for example, which are used in very different contexts (in
the DOM, and in directives). Angular's 'controllers' are actually closer to
models IMHO (they are where you manipulate state) than controllers.

------
stickhandle
From Addy @ - [http://coding.smashingmagazine.com/2012/07/27/journey-
throug...](http://coding.smashingmagazine.com/2012/07/27/journey-through-the-
javascript-mvc-jungle/) ::

I want something flexible which offers a minimalist solution to separating
concerns in my application. It should support a persistence layer and RESTful
sync, models, views (with controllers), event-driven communication, templating
and routing. It should be imperative, allowing one to update the View when a
model changes. I’d like some decisions about the architecture left up to me.
Ideally, many large companies have used the solution to build non-trivial
applications. As I may be building something complex, I’d like there to be an
active extension community around the framework that have already tried
addressing larger problems (Marionette, Chaplin, Aura, Thorax). Ideally, there
are also scaffolding tools (grunt-bbb, brunch) available for the solution. Use
Backbone.js.

I want something declarative that uses the View to derive behavior. It focuses
on achieving this through custom HTML tags and components that specify your
application intentions. It should support being easily testable, URL
management (routing) and a separation of concerns through a variation of MVC.
It takes a different approach to most frameworks, providing a HTML compiler
for creating your own DSL in HTML. It may be inspired by upcoming Web platform
features such as Web Components and also has its own scaffolding tools
available (angular-seed). Use AngularJS.

------
paullth
I tried both in similar circumstances (coming from a long backbone
background), all I can say is I personally found with Ember.js (around august
2012): \- more boilerplate \- learning curve was much steeper. \- the
documentation confused me, it turned out there were many slight diferences
between 0.9.xxx and 1.xxx. This "gotcha" is probably rectified by now

I tried Angular.js next (this month) and "got it" immediately: \- testing is
easier \- writing dom manipulation is easier (ie directives) \- the
documentation/seed projects are great \- angular-ui project is cool

In that last 6 months I imagine Ember has improved, I also feel like if I came
to it now Id pick it up quicker having gone to all this effort

~~~
regularfry
> This "gotcha" is probably rectified by now

It's not. The guides published on emberjs.com apparently track the master
branch on github, so are regularly out of sync with the version offered for
download on the front page, and at the moment there's a _third_ version
bundled with the starter kit. This completely tripped me up when I tried to
get off the ground a couple of weeks ago, because things that were described
as working in the guides _just didn't_ , and it wasn't clear what I'd got
wrong.

EDIT 'cos noprocrast kicked in at the wrong moment: Add to this a release
policy of stuffing new functionality in every minor release, and you've got
documentation that, for someone completely new to it, who doesn't know what
they don't know, feels like a minefield. The one thing you want as a beginner
is documentation you can _trust_ , and Ember just doesn't provide that yet.

To learn enough get off the ground, I ended up writing an "assume you know
nothing" tutorial
([https://github.com/regularfry/website/blob/master/source/gui...](https://github.com/regularfry/website/blob/master/source/guides/getting-
started/your-first-ember-app.md)), which I've submitted back to emberjs.

~~~
rxcfc
This was only true briefly. The guides on emberjs.com reflect the currently
released version, 1.0 RC. Since we've hit RC the APIs are now frozen.

~~~
regularfry
I checked the dates. I tripped over the docs not matching the download version
on January 7th. I found non-matching versions _yesterday_. It's possible that
both times I decided to look at it I got unlucky, I guess.

I'm glad the APIs are frozen, I was worried there'd still be creep through the
RCs.

~~~
rxcfc
We were in the middle of the release yesterday. If anything is still not
matching, please let us know so we can correct it.

------
UweSchmidt
Most enjoyable thing for me (and great in very common situations) in
Angular.js is the two-way databinding and the "ng-repeat" thing. These things
are easy and lie on the "flat" part of the S-shaped learning curve.

Also that there is no templating system - I always disliked having to learn
and use and debug another abstraction layer (Mustache/Handlebars or Razor with
MVC etc.).

The biggest "gotchas" with these frameworks will typically be the problem of
having to wrap your head around a few new and unfamiliar concepts and syntax
that take a while to "grok". (On the other hand, it's NOT difficult in a
objective sense, like some advanced mathematics that not everyone is capable
of doing, so, to anyone reading these JS framework-threads on HN, please end
up encouraged to try them out yourself.)

Learning one framework will greatly help your understanding of the other, so
I'd say just pick one and decide later which one is "best".

------
peteforde
I have enormous confidence in the capabilities of the team working on Ember.
jQuery, Sproutcore, Rails core team members. If you're a Rails developer, the
existence of active_model_serializers as a quasi-standard for how JSON is
shuttled between tiers suggests that Ember has taken a position of strong
thought leadership on a lot of things that other frameworks just don't have
the reach to do.

Also, the recent Peepcode screencast on Ember is brilliant.

~~~
codygman
Looks like the peepcode screencast is paid:

<https://peepcode.com/products/emberjs>

I suppose you'll say it's well worth the money? Anyone else bought/watched
this screencast?

~~~
phasevar
I bought it. It was definitely worth the money.

~~~
datahack
Seconded.

------
rxcfc
This is a good post on why Discourse chose Ember:
[http://eviltrout.com/2013/02/10/why-discourse-uses-
emberjs.h...](http://eviltrout.com/2013/02/10/why-discourse-uses-emberjs.html)

~~~
codygman
Indeed, great post. I'm really interested in seeing perspectives of those
who've used both though, hopefully those mysterious people exist ;)

------
clux
Neither. Small modularized CommonJS files that serve the need of what you are
doing is always faster to write and easier to load in your head than large
frameworks that you never fully understand. Learn to use npm and use it well.

~~~
camus
you obviously never wrote a "fat" client and had to maintain it : at some
point you need some kind of framework to make sense out of the "small modules"
mess. And CommonJS doesnt solve dependency injection issues.

~~~
Kiro
"dependency injection issues"?

------
boubiyeah
To people saying "backbone", stop. Backbone is a tiny abstraction that pretty
much does nothing; It's the worst of both worlds: You have to use fake
getters/setters but the framework is absolutely unhelpful.

Angular is more developer friendly as it avoids crappy string templates and
let you program to POJOS; Programming with POJO in Javascript circa 2013 has a
big performance cost that might be very noticeable in some cases (Mobile, low
spec devices, sites with a lot of interaction/server pushes). Basically
Angular simply DOES NOT scale by design, but 90% of websites will still be
kind of ok (This gray line is exactly why I don't use Angular :) ).

------
angryasian
From what I've seen for the most part they both try to accomplish the same
thing. Both will require time to learn and work into your application. A lot
of the comments I read are from people that are anti-google or question
angular because of its google beginnings, so they are anti angular and because
ember is created by a rails developer it integrates better with rails.

Just go through the egghead tutorials then go over ember documentation and
then make a decision. I don't think you can go wrong with either one.

------
jongold
As a relative beginner - "It's a very different approach when compared to
using jQuery for everything" — is a bit misleading. They're _both_ very
different to jQuery (or Backbone/Spine - which are beautifully simple).

Totally anecdotal: \- Backbone I learnt straight away and have been
progressively writing better code for around a year. It gives you enough rope
to hang yourself but you can usually see what you've done and refactor. Which
is nice. \- Ember I've been trying to learn a couple of times for the past
year. Keep trying. Find a tutorial. It's out of date. Get frustrated. Try
again. Find another one. It's poorly written. Try Again. Find another one.
Can't get something to work and Ember is too much of a blackbox to debug. Give
up.

The docs on the site are getting better (but still suck) - the PeepCode
tutorial was great ( _not_ the Play By Play with Yehuda; don't waste your
money on that) - but it still only did relatively trivial things. Would be
great if PeepCode did a Play By Play with a Rails API and relational data etc.

\- Angular scared me for ages too - the docs, as with Ember, are written by
people who know how to use the framework _for_ people who know how to use it
already. Then Egghead.io happened. Wow. The concepts actually aren't that
hard!

I think what the community sorely needs is a _good_ Ember teacher - one that
isn't patronising or aimed at computer scientists!

~~~
mehulkar
> I think what the community sorely needs is a good Ember teacher

I think what we really need is a tool to go around and mark outdated blog
posts as outdated. There's also this: <http://www.embercast.com/>. Not sure
where it's going.

------
ktavera
I've used Angular and really enjoyed developing with it. You get results
really fast. It feels like a more organized Knockout.js (which is also great).

------
sidcool
Personally, I have found Angular JS very comprehensive. I have used bits of
Backbone, Ember and Angular and have found Angular pretty good.

------
aviraldg
Related query: I've just started with some JS MVVM frameworks, and I was
wondering if any of them can "reverse bind" ie. enable you to render part of
your templates on the server and utilise data from that based on a template to
recreate models. The idea is to make the initial load snappy and to help with
SEO (only one or two web crawlers actually execute JS afaik)

~~~
codygman
I believe almost all of them have this capability. I know angular has
templates and you can put dynamic data in those templates. The dynamic data
can be loaded from anywhere. I'm not aware of any MVVM that doesn't allow you
to do this, unless I misunderstand what you are saying.

~~~
aviraldg
I guess I wasn't clear enough.

You're talking about data -> template binding. I'm talking about the reverse,
where some data (as a model) is recovered from a partial server-side render of
the page, based upon the "patterns" described in the templates.

For example, if Angular did this (I don't think it does), it could traverse
the generated HTML and compare it with the original template to figure out
what's what.

~~~
rio517
I haven't explored what your describing, but I'm using a different solution.
I'm adding backbone to an existing project and added some server side code
that outputs the current model object as json in a <script> tag in the html
page. This is passed to a new backbone model instance.

------
sahat
Take a look at source code examples of Angular and Ember Todo apps:
<http://addyosmani.github.com/todomvc/>

Some interesting facts about Todo apps:

Angular.js: 10 requests, 41.94kb transferred.

Ember.js: 17 requests, 334.12kb transferred.

~~~
wycats
If by interesting you mean totally misleading, then sure!

The Ember.js version included is unminified, and the number of files reflect
several small files rather than one big file. The goal of TodoMVC is to
compare code style.

But sure, we'll submit a pull request to TodoMVC to use the minified version
of Ember.

------
swah
My doubts:

\- If a great amount of my functionality isn't covered by the directives - say
my app does the bulk of interactions with Raphael.js instead of
forms/checkboxes - is Angularjs still worth to include, or should I go with
something lighter?

\- (similar) If I'm going to use a lot of jQuery plugins or external
libraries, say jPlayer + D3.js + jQuery File Upload, etc - is Angular gonna
get in my way when using them?

In other words, would you write those frontends with AngularJS? (Perhaps we
should ignore the very short load-time requirement...)

    
    
       - Facebook
       - Gmail
       - Soundcloud
       - Twitter
       - Youtube
       - WolframAlpha
       - Reddit
       - Google Spreadsheet
       - Amazon
       - Backpack

~~~
codygman
Here is a youtube frontend that was written with angular.js:
<http://toogl.es/#/browse>

Sorry, I can't comment on the others.

------
mping
For me, Angular displays the right balance beween complexity and ease of use.
After getting past some of barriers (the transclusion docs could be more
easily explained, specially with some images), I find it pretty easy to use,
and it's great for complex apps. Never used Ember though, after using Spring
for so long, dependency injection comes naturally.

Some people mention Backbone, I think it's great if you're very comfortable
with JS, otherwise you'll end up replicating bits of other frameworks by hand
or using lots of 3rd parties (ex: databinding, validation, complex model
interaction, view cleanup).

Anyway, take a few days to get the feel of each and choose according.

------
bgowttamen
Ours is basically a CRUD App, i tried to build it in Ember.js but gave up
after not finding an step by step getting started (like the one in angularjs
homepage),

after that i started to learn angular, it had an step by step guide and
working with ng-repeat was such a bliss, we were able to launch a simple
billing system in about 5 days using angularjs, egghead videos help me
whenever i find something difficult to implement (like 2 way binding between
controller and a directive)

------
programminggeek
I actually really like the KnockoutJS + SammyJS approach to building single
page apps. Angular is probably closer to that approach.

MVVM is awesome and will save you a lot of time IMO.

~~~
pbiggar
We're currently using Sammy + Knockout on <https://circleci.com>, and it is
nice, but adding observables everywhere is annoying. I'd love to hear from
anyone who moved from this to Angular or Embed?

------
georgewfraser
Ember is object-oriented, angular is functional(ish).

~~~
stanley
This is one of the key issues folks seem to skip past when discussing the
differences.

I'm not familiar with the maintainers of Angular and their backgrounds, but
with Ember you can expect solutions that mimic the methodologies you'd
otherwise find in Rails. I'm particularly referring to OO in this case.

------
rtpg
Uninformed opinion:

I looked at angular.js and understood how to use it pretty quickly , with
ember.js there seems to be a lot more framework-yness to it.

------
mehulkar
The biggest + for me with Ember is the community around it. I have felt like
I've grown with the community in the past few months as I've learned the
framework. The freenode channel is usually active with lots of help available.

It would be unfair for me to compare this experience to Angular though because
I haven't been so deeply involved with it.

------
tzury
None.

Backbone + underscore + jQuery.

Unless you really have to have a framework.

The combination of the above will have you writing in JS rather than in
framework X.

~~~
harpb
If using Backbone, then <https://github.com/marionettejs/backbone.marionette>
is a MUST. It would cut down on lot of code and it makes code more cleaner. In
addition, switch to CoffeeScript.

------
malandrew
I'd also add the question "Which is more flexible?". Last thing I want is to
pour weeks and weeks into a framework to discover that I have to be a
witchdoctor to bend it to my will when I want to do anything even just
slightly out of the ordinary.

------
mlakkadshaw
I want to learn Ember, but the official docs are confusing, and the tutorials
are outdate, are there any YouTube videos or any other of tutorial on Ember?

~~~
rxcfc
The docs are actually quite good now. As we've just released 1.0 RC, the API
is also frozen which will help the docs improve even further.

~~~
toddh
The guides are good, but I'm missing the whole put it all together to make a
real app tutorial type level of documentation. Can you point me to something
like that?

~~~
mgrassotti
The recent peepcode ember video pulls things together nicely, but of course
it's not free. <https://peepcode.com/products/emberjs>

Also there is a great example project available here:
<https://github.com/dgeb/ember_data_example>

------
tferris
Angular worked far better for me

------
gkatsanos
Angular, hands down.

------
indubitably
backbone.js

------
camus
ok here is my take :

AngularJS :

\+ MVVM : databinding

\+ Dependency Injection, so no global state, and loose coupling

\+ Well organised into services , view models ,directives , filters , ...

\- forget any projects that are animation/transition between views heavy,
you'll fail

\- doesnt play well with some other frameworks ( requireJS, jQuery mobile ,
even phonegap ...)

\- is slow when dealing with a lot of data.

\- no control over dom objects lifecycle

\- the doc sucks

\- if you dont understand Dependency injection , dont use it.

\- will not scale if javascript dont get some new structures , dirtychecking
is insane given javascript performances.

Ember: \+ fully event driven

\+ plays well with other libraries

\+ less magic than angular

\+ full control over DOM lifecycle

\- the doc sucks but less than angularJS one

\- more verbose than AngularJS

\- unstable API

I built apps in both langages. like that one :

<http://markme.alwaysdata.net/>

I prefer Ember but have no problem using Angular when I have to.

~~~
patrickaljord
> forget any projects that are animation/transition between views heavy,
> you'll fail

Animation is coming to the next version. It's already possible but you have to
do it yourself.

> doesnt play well with some other frameworks ( requireJS, jQuery mobile ,
> even phonegap ...)

* <https://github.com/tigbro/jquery-mobile-angular-adapter> * <http://briantford.com/blog/angular-phonegap.html>

> is slow when dealing with a lot of data.

It's fast enough not to be noticeable by humans unless you're batman as
explained by Angular creator:
[http://stackoverflow.com/questions/9682092/databinding-in-
an...](http://stackoverflow.com/questions/9682092/databinding-in-
angularjs/9693933#9693933) . Object.observe will make it fast even if you're
batman.

> no control over dom objects lifecycle

There is control actually (see digest, apply etc).

> the doc sucks

The guides are actually pretty good and <http://egghead.io/> free screencasts
are awesome.

Edit: Google is going to sponsor the author of egghead.io videos!
<https://twitter.com/eggheadio/status/302494160982781953>

> if you dont understand Dependency injection , dont use it.

You don't have to understand DI to use it. I know I didn't.

> will not scale if javascript dont get some new structures , dirtychecking is
> insane given javascript performances.

Again, read this [http://stackoverflow.com/questions/9682092/databinding-in-
an...](http://stackoverflow.com/questions/9682092/databinding-in-
angularjs/9693933#9693933)

~~~
camus
> * <https://github.com/tigbro/jquery-mobile-angular-adapter> *
> <http://briantford.com/blog/angular-phonegap.html>

that's what i'm saying i should not need an adapter for these libraries , i
dont need them with Ember or Backbone

~~~
patrickaljord
You don't _need_ them but they make it more convenient. There's one for ember
too <https://github.com/LuisSala/emberjs-jqm>

------
phasevar
Ember.js

~~~
codygman
What are the top 5 reasons for you to use Ember over another MVMM?

