2015. május 17., vasárnap

Angular vs. React - Round I.


I've been toying with these frameworks for a while (a year maybe?), trying to implement a basic character generator web app for Fantasy Flight Games's excellent Edge of the Empire RPG. It is not that the world needs such application, it is more about me finding the framework I can easily work with. Let the fight begin!
On a very high conceptual level React is much like PHP: it can be very modular and tries to slip into your pages unobtrusively. Well, considering its Facebook roots it is not a surprise. The template syntax called JSX tries hard to look familiar, and with some minor exceptions (summarized on a this page) it feels like good old html. It is pretty much a facade though: all those familiar looking html elements are pure JavaScript objects, organized into a virtual DOM, eventually reconciled against the actual DOM by React somewhere in the backstage. This has not bothered me so far, it is more like watching a movie and knowing it is not real. Maybe it is the best for all parties involved: who whats to be stabbed in a shower for real?
Angular.JS on the other hand feels more close to the big frameworks like good old JSP and ASP with a markup page and a code-behind class. Don't get me wrong: you will probably end up with the same ratio of generic vs. framework specific tags in your html using both. The difference is more in the approach: React builds bottom up, while Angular is geared toward the do everything type usage: it works really well if you do most of your page in Angular. While React tries to be a very good "V" in the MVC (or MVVM), Angular is a full stack MVVM framework.
I am pretty new to most of these and probably missed some real important concepts on both sides. At the end it is more about your personal preference and project needs: if you like the "build your toolbox, then your stuff" approach, React can serve you very well. On the other hand it has less to offer than Angular. This could be a blessing if your page has some kind of backbone.js like framework deeply integrated.

4 megjegyzés:

  1. For obvious reasons (khm...) I've started to look into these, as well. While I'm about to build a sample in Angular, Backbone and React, initially I'm leaning towards Backbone as it seems to give me the most flexibility in manipulating the DOM, which is ultimately what JS is about. Angular's big plus is testability and fast prototyping with automatic binding. React is fast when updating the DOM, and convenient to have the markup next to the JS. Ember's logic is too close to Backbone, so why not choose the big brother?
    The more the framework does, the more likely we won't be able to integrate proven widgets as easily as before. Abstractions may be a hazard for any non-trivial app.

    1. For any non trivial app you will end up fighting performance issues eventually. This takes you through the framework code, and you need to understand it to find the way to make it faster.
      So I guess it boils down to the question: which framework makes more sense to you? Which concept would you choose to implement given enough time?