Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Angular vs Backbone vs React vs Ember notes

Note: these are pretty rough notes I made for my team on the fly as I was reading through some pages. Some could be mildly inaccurate but hopefully not terribly so. I might resort to convenient fiction & simplification sometimes.

My top contenders, mostly based on popularity / community etc:

  • Angular
  • Backbone
  • React
  • Ember

Mostly about MVC (or derivatives, MVP / MVVM).

  • A way of cleanly separating data, presenting data, and business logic (e.g. “To get the total exports of a country, you must sum its exports with every individual country”). Following definitions differ slightly depending on which interpretation you’re using, but the gist is similar.
    • Model: Provider of data - could be an API. Could be a javascript object. Could be anything. It’s the “state” of the application, anything from the data in your viz to which buttons are current clicked and whether we’re showing exports or imports.
    • Controller: Sits between everything and decides how to process the user input, where to gather data from, what to do with it, etc.
    • View: e.g. templating - how the application actually looks to the user and where the user interacts with the application.
  • Why? e.g.

Some terminology:

  • Two way data binding
    • I change something in the view (UI), the model (state data) changes automatically. I change the model, the view changes automatically. See: http://n12v.com/2-way-data-binding/ especially the angular example is pretty concise. Saves a lot of time and reduces bullshit boilerplate code.
  • Dependency injection
    • A technique where the framework loads modules automatically for you. So let’s say your app needs a NetworkGraphVisualization and that one requires a D3Visualization and a SliderWidget, which in turn requires JQuery, a dependency injection framework will initialize all that junk for you. This also encourages separation of concerns.
  • Routing: Being able to index a specific view in the app with a specific URL and having the URL change with the app state.
  • Templates: You define the structure of HTML and provide slots, then you can plug in any data you want. Can be generated from a string with templating code in it or by writing html-like DOM stuff - handlebars is the former and Angular directives is the latter.

My impressions:

@makmanalp

This comment has been minimized.

Copy link
Owner Author

commented Jan 21, 2015

Cool flux implementation that has a few more abstractions for managing state: http://martyjs.org/

@makmanalp

This comment has been minimized.

Copy link
Owner Author

commented Jan 21, 2015

Reactions from @thebenedict re: angular and the limited usefulness of combining template filters: https://gist.github.com/thebenedict/a281de5298ea430625ba

And the all-too famous angular bashfest: https://medium.com/@mnemon1ck/why-you-should-not-use-angularjs-1df5ddf6fc99

@makmanalp

This comment has been minimized.

Copy link
Owner Author

commented Jan 21, 2015

React vs polymer - kind of affirmed my opinion that react makes architecturally decent decisions while the gross-factor is still kinda high: http://programmers.stackexchange.com/questions/225400/pros-and-cons-of-facebooks-react-vs-web-components-polymer

@makmanalp

This comment has been minimized.

Copy link
Owner Author

commented Jan 21, 2015

The road to ember 2.0 - Kinda impressed with the amount of public thought and discourse by the ember devs: emberjs/rfcs#15

@makmanalp

This comment has been minimized.

Copy link
Owner Author

commented Jan 21, 2015

A useful comparison between ember components and angular directives: https://twitter.com/tomdale/status/361288660240441344

@kunthar

This comment has been minimized.

Copy link

commented Feb 12, 2015

So how was your quest ended? Wondering which one you decided. 😀

@makmanalp

This comment has been minimized.

Copy link
Owner Author

commented Feb 18, 2015

@kunthar I think we're leaning pretty heavily towards ember at this point :) Again, it seems like a needs thing so I didn't want to mandate a decision here - but angular was quickly eliminated due to 2.0 on the horizon and the impending shift - we don't want to build something that'll become legacy in 2 years. We liked the fact that ember gives you a decent structure to begin with. It's opinionated but we agree with its opinions for the most part. React and backbone were less structured and more DIY, which isn't necessarily bad and gives you more flexibility, but I think ember does what we need and we'd like to focus on other things that are more pressing for us.

@dxmo

This comment has been minimized.

Copy link

commented Apr 1, 2015

@makmanalp I've been working with Ember for sometime and I can not be happier with the direction it is taking. Specially with the introduction of 'ember cli' which brings amazing order to both small and big projects its been an absolute pleasure to work with and would suggest to use it right from the start, make the whole process and also collaboration a lot easier for devs. Good luck!

@marksimon321

This comment has been minimized.

Copy link

commented May 11, 2015

In Angular the DOM structure is created on pageload. Suppose you have multiple templates in your page and you don’t want to show them at a time. In that case also you have to define those at page load lavel, if you use angular, which will unnecessary create few extra DOM elements. But in Ember you can insert dynamic templates as it uses string based templating method. So in this perspective Ember and Backbone’s string-based templating may go handy, but if you talk about data binding, DOM-based templates provides you better performance. According to the Angular developers’ team, in near future DOM-based templating will be natively supported on browsers and when this happens,
http://www.agileinfoways.com/technical-expertise/front-end-development/angular-js/

Angular apps will run way too faster, so we should best prepare ourselves for the future by adopting it now. AngularJS is from Google, so they are already working on this with Chromium and standards bodies.

@MohamadAtieh

This comment has been minimized.

Copy link

commented Sep 8, 2015

Hey, is it a good idea to start a new production project using Angular 1? What are the alternatives?

@Vespira

This comment has been minimized.

Copy link

commented Oct 20, 2015

@MohamadAtieh Maybe it's a bit late to answer, but I advise you a lighter framework for apps containing a lot of elements client-side. In fact, the nested loops consume a lot of resources, and the two way data binding, if used in a bad way (too much calls or updates, useless watches, ...) can also hardly slow your front-end performances. I'm currently doing a fat-app with Angular 1.x and I start to wondering if it was a good choice. If I could re-start from scratch, I would maybe pick up Backbone or Ember. Even if I'm not well-informed about the differences, it's my current feeling of the thing.

@MurhafSousli

This comment has been minimized.

Copy link

commented Nov 8, 2015

Thanks for sharing

@simonrepp

This comment has been minimized.

Copy link

commented Dec 17, 2015

👍

@DCRichards

This comment has been minimized.

Copy link

commented Dec 31, 2015

thanks for this, really useful as junior dev just getting into frameworks a little

@tomekrozalski

This comment has been minimized.

Copy link

commented Feb 1, 2016

I know that such comparisons should be concise, but I think it is not such simple. For example you wrote that Backbone hasn't two way data binding. It would be HUGE disadvantage - if it would be true ;) You can reach 2-ways data binding in Backbone in the best in opinion way: http://n12v.com/2-way-data-binding/

@wouterds

This comment has been minimized.

Copy link

commented Feb 1, 2016

Anyone opinions on newcomer, vue.js (http://vuejs.org/)?
I personally haven't used it but saw some fuzz about it recently.

@BBGONE

This comment has been minimized.

Copy link

commented Feb 10, 2016

Interesting what would anyone say about this framework (https://github.com/BBGONE/jRIAppTS)?
I made it for myself but shared with anyone who chooses to use it and i use it at my work to create LOB applications.
This framework is MVVM which i liked using Microsoft Silverlight and WPF.
I don't specially advertise it, but simply want to know why do so many choose to create or use MVC pattern instead of MVVM and databinding? I feel MVC pattern very clumsy

@codecraftscraic

This comment has been minimized.

Copy link

commented Mar 14, 2016

Thanks for sharing your research, immensely helpful.

@Berkmann18

This comment has been minimized.

Copy link

commented Apr 20, 2016

What is currently your favourite ?

@asergeyev

This comment has been minimized.

Copy link

commented Sep 21, 2016

Mali what did you end up using most often in 2016? :)

@yoo-gyoon

This comment has been minimized.

Copy link

commented Jul 7, 2019

reviewing JS framework comparisons in 2019 - still 👍🏻

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.