5 ms·

The team I'm apart of started a project 2 months ago. We chose React and Redux over Ember, Angular, et al. A main decision factor was that we needed the server

by roebk 11y ago

The team I'm apart of started a project 2 months ago. We chose React and Redux over Ember, Angular, et al. A main decision factor was that we needed the server to render our initial HTML, neither Angular nor Ember can achieve this easily, we'd most likely have to lean on a third-party service. Angular looked particularly unattractive with Angular 1 being as good as dead and we didn't feel confident starting with Angular 2, there we're simply too many unknowns. We loved the hot loading & the redux-devtools features, turns out these have given us a decent productivity boost. 2 months into the project I'm confident we chose the best tools for the job, there's been absolutely no regrets from the team members.

pluma 11y ago
The problem is that the surface of Angular is incredibly complex. With React, you have components, which are just things (classes or functions) that convert a set of properties to a subtree of more components (ideally mostly ones that directly represent DOM elements) and do so deterministically and reproducibly. With Redux you just have objects ("actions") representing changes to your application state and functions ("reducers") that convert an action and the current state into the future state. There are also functions ("action creators") that help you create the former and functions ("middleware") that affect how Redux processes them. With Angular1 you have templates and directives and components and models and scopes and controllers and filters and injectors and services. And services can be constructors or factories or providers or values or constants or decorators. And scopes can be isolate or nested and there is the digest cycle and there are watch functions and if you do anything async outside of Angular you need to make sure to trigger the digest cycle (but not if you're already in the digest cycle) and I haven't even talked about interpolation yet. Angular2 is slightly better but the docs are pretty sparse and many people's brains will still shut off as soon as they hear "dependency injection" and have you fucking seen what they have done to HTML to maintain their false illusion of "it's just HTML and JavaScript, designers can understand this"? React doesn't need you to think. Initially the API made you define components by using a magical function, then they extended it to allow just using ES2015 classes, now you can even define simple components as plain old functions. The surface has shifted from minimal to nearly non-existent. Redux has more conceptual overhead than React ("Wait, reducers can't have side-effects? Where does my AJAX go?") but most of the learning time is spent un-learning concepts you take for granted (e.g. you shouldn't mutate state, your components should ideally not have any state at all and it's perfectly fine to normalize your state because you only need to derive it when it actually changes). The number of actual concepts Redux brings to the table is fairly low. Angular is a battleship. React+Redux is an attack submarine.
- Omnipresent 11y ago
  Great comparisons. What's good resources to start learning react + redux?
  - pluma 11y ago
    I'd suggest starting with the React docs: https://facebook.github.io/react/docs/why-react.html https://facebook.github.io/react/docs/why-react.html And once you understand React you can dive straight into the Redux docs: http://redux.js.org/index.html http://redux.js.org/index.html I found it useful to actually read the Redux docs page-by-page (at least the introduction and basics) but it also links to some tutorials. I actually had to read the basics and advanced sections several times before it fully clicked. It helps if you don't expect Redux to be super complex -- like React it does just one thing: manage your state by responding to actions. If React is the V in your MVC, Redux is the M.
    - ausjke 11y ago
      what will be the "best C" then? any recommendations?
      - tracker1 11y ago
        The C (Controller) is your own code, that controls your logic/needs.
      - pluma 11y ago
        Usually some router -- typically react-router -- and a tiny bit of glue code. That's where the MVC analogy breaks down, to be honest.
    - deleted 11y ago
      [deleted]
- hitekker 11y ago
  > Angular is a battleship. React+Redux is an attack submarine. > The value of the battleship has been questioned, even during the period of their prominence.... battleships were increasingly vulnerable to much smaller, cheaper weapons...[11] https://en.wikipedia.org/wiki/Battleship https://en.wikipedia.org/wiki/Battleship I'm not sure if your metaphor was intentional, that Angular is like a flashy, seemingly powerful but ultimately archaic, dead-on-arrival platform, but I appreciate it nonetheless.
sandstrom 11y ago
Ember has a solution for server-rendered HTML, called 'Fast Boot'. It can be used both for speedup (quite obvious, given the name) and for e.g. SEO-purposes (though I think Google is pretty good at crawling JS these days). It's still at a very early stage though (alpha), but I think it has great promise. More details in the recent 2.3 beta changelog: http://emberjs.com/blog/2015/11/16/ember-2-2-released.html#toc_ember-js-2-3-beta http://emberjs.com/blog/2015/11/16/ember-2-2-released.html#t... (Not saying you made the wrong choice, it sounds very reasonable -- Ember's solution isn't ready for use just yet. But thought I'd note this here in case others have the same thought)
- roebk 11y ago
  We did take a look at Fast Boot and if I remember correctly it came with a big caveat that it's only suitable for the most brave. If Fast Boot were stable then Ember would have been a real strong contender. I'm really excited at the rate of pace of change on the front-ends. My last project was in Backbone and React & Redux feel a gigantic leap forward. I'd love to experiment with Elm and Cycle.
nyam 11y ago
yep, i'm also working on a react/redux project (where i'm only js senior and rest of the team are rails devs with only basic js skills) and big advantage is, how easily and quickly they became productive. We have other project in Ember, where logic was to take advantage of similar concepts & conventions as in rails, but in reality it's incomparable.

by roebk 11y ago

pluma 11y ago

The problem is that the surface of Angular is incredibly complex. With React, you have components, which are just things (classes or functions) that convert a set of properties to a subtree of more components (ideally mostly ones that directly represent DOM elements) and do so deterministically and reproducibly. With Redux you just have objects ("actions") representing changes to your application state and functions ("reducers") that convert an action and the current state into the future state. There are also functions ("action creators") that help you create the former and functions ("middleware") that affect how Redux processes them. With Angular1 you have templates and directives and components and models and scopes and controllers and filters and injectors and services. And services can be constructors or factories or providers or values or constants or decorators. And scopes can be isolate or nested and there is the digest cycle and there are watch functions and if you do anything async outside of Angular you need to make sure to trigger the digest cycle (but not if you're already in the digest cycle) and I haven't even talked about interpolation yet. Angular2 is slightly better but the docs are pretty sparse and many people's brains will still shut off as soon as they hear "dependency injection" and have you fucking seen what they have done to HTML to maintain their false illusion of "it's just HTML and JavaScript, designers can understand this"? React doesn't need you to think. Initially the API made you define components by using a magical function, then they extended it to allow just using ES2015 classes, now you can even define simple components as plain old functions. The surface has shifted from minimal to nearly non-existent. Redux has more conceptual overhead than React ("Wait, reducers can't have side-effects? Where does my AJAX go?") but most of the learning time is spent un-learning concepts you take for granted (e.g. you shouldn't mutate state, your components should ideally not have any state at all and it's perfectly fine to normalize your state because you only need to derive it when it actually changes). The number of actual concepts Redux brings to the table is fairly low. Angular is a battleship. React+Redux is an attack submarine.

Omnipresent 11y ago
Great comparisons. What's good resources to start learning react + redux?
- pluma 11y ago
  I'd suggest starting with the React docs: https://facebook.github.io/react/docs/why-react.html https://facebook.github.io/react/docs/why-react.html And once you understand React you can dive straight into the Redux docs: http://redux.js.org/index.html http://redux.js.org/index.html I found it useful to actually read the Redux docs page-by-page (at least the introduction and basics) but it also links to some tutorials. I actually had to read the basics and advanced sections several times before it fully clicked. It helps if you don't expect Redux to be super complex -- like React it does just one thing: manage your state by responding to actions. If React is the V in your MVC, Redux is the M.
  - ausjke 11y ago
    what will be the "best C" then? any recommendations?
    - tracker1 11y ago
      The C (Controller) is your own code, that controls your logic/needs.
    - pluma 11y ago
      Usually some router -- typically react-router -- and a tiny bit of glue code. That's where the MVC analogy breaks down, to be honest.
  - deleted 11y ago
    [deleted]
hitekker 11y ago
> Angular is a battleship. React+Redux is an attack submarine. > The value of the battleship has been questioned, even during the period of their prominence.... battleships were increasingly vulnerable to much smaller, cheaper weapons...[11] https://en.wikipedia.org/wiki/Battleship https://en.wikipedia.org/wiki/Battleship I'm not sure if your metaphor was intentional, that Angular is like a flashy, seemingly powerful but ultimately archaic, dead-on-arrival platform, but I appreciate it nonetheless.

sandstrom 11y ago

Ember has a solution for server-rendered HTML, called 'Fast Boot'. It can be used both for speedup (quite obvious, given the name) and for e.g. SEO-purposes (though I think Google is pretty good at crawling JS these days). It's still at a very early stage though (alpha), but I think it has great promise. More details in the recent 2.3 beta changelog: http://emberjs.com/blog/2015/11/16/ember-2-2-released.html#toc_ember-js-2-3-beta http://emberjs.com/blog/2015/11/16/ember-2-2-released.html#t... (Not saying you made the wrong choice, it sounds very reasonable -- Ember's solution isn't ready for use just yet. But thought I'd note this here in case others have the same thought)

roebk 11y ago
We did take a look at Fast Boot and if I remember correctly it came with a big caveat that it's only suitable for the most brave. If Fast Boot were stable then Ember would have been a real strong contender. I'm really excited at the rate of pace of change on the front-ends. My last project was in Backbone and React & Redux feel a gigantic leap forward. I'd love to experiment with Elm and Cycle.

nyam 11y ago

yep, i'm also working on a react/redux project (where i'm only js senior and rest of the team are rails devs with only basic js skills) and big advantage is, how easily and quickly they became productive. We have other project in Ember, where logic was to take advantage of similar concepts & conventions as in rails, but in reality it's incomparable.