Skip to content

Instantly share code, notes, and snippets.

@makmanalp
Last active June 10, 2024 14:24
Show Gist options
  • Save makmanalp/9b7f50aa16d21c2f9d37 to your computer and use it in GitHub Desktop.
Save makmanalp/9b7f50aa16d21c2f9d37 to your computer and use it in GitHub Desktop.
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:

@MurhafSousli
Copy link

Thanks for sharing

@simonrepp
Copy link

👍

@DCRichards
Copy link

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

@tomekrozalski
Copy link

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
Copy link

wouterds 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.

Copy link

ghost 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
Copy link

Thanks for sharing your research, immensely helpful.

@Berkmann18
Copy link

What is currently your favourite ?

@asergeyev
Copy link

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

@jamezening
Copy link

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