Hi I am studying Angular 2 and React + Redux right now, and I have a question on the difference of the difference in data flow of those two choices.
Thanks a lot in advance !
flux-angular makes it easy to implement a performant, scalable, and clean flux application architecture in an angular application. It does this by providing access to a new angular. store method for holding immutable application state using Baobab.
Flux eschews MVC in favor of a unidirectional data flow. When a user interacts with a React view, the view propagates an action through a central dispatcher, to the various stores that hold the application's data and business logic, which updates all of the views that are affected.
If the process is not followed correctly while rendering the data into the DOM, it leads to major issues like performance overhead and so on. This is why we need a unidirectional data flow mechanism, which ensures that the data is moving from top to bottom and that changes are propagated through the system.
Unidirectional data flow describes a one-way data flow where the data can move in only one pathway when being transferred between different parts of the program. React, a Javascript library, uses unidirectional data flow. The data from the parent is known as props.
By using Redux with angular 2, you are centralizing your application state in a single place totally seperate from your components: the store.
Your components can then be stateless, allowing you to disable internal change detection on them like this.
@Component({
changeDetection: ChangeDetectionStrategy.OnPush
})
class myComponent {
@Input() inputFromTheStore: Observable<State>;
}
Indeed the above example is a stateless component, on wich you plug in a stream of state.
Also to answer your question :
Angular 2 uses uni-directional data flow by default. Redux is a Flux implementation, which (also) uses uni-directional data flow. What is the crucial difference among those? (is it maybe, the composition of parts?)
The crucial difference is that with Redux the state will always be coming in from above via @Input()
. Unlike traditional angular2 statefull components where state could transit through @Input()
and @Output()
.
If those two are not so much different in terms of how data flows, why would anyone use Flux or Redux over default choice of Angular 2 framework?
Angular mostly provides UI layer (components) while the state management is not predefined by the framework. Since angular has services, you can keep the business logic in services (stateful services) and UI state in components (stateful components), but it means that there is no single place for the state as it is distributed among services/components.
The main reason to use redux
in angular application is to separate UI layer from the data layer. In redux, the state is separated into a separate layer (think single tree-like object) which gets synchronized with UI layer (components) through special services injected into components constructor (check this setup).
If those two are quite different, is there a name I can call for Angular 2's data flow for further references to compare those two?
I haven't come across one, probably because as I mentioned above angular as a framework is focused on presentation, not state.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With