Angular2周围的架构模式:Redux,Flux,React,Reactive,RxJS,Ngrx,MVI,

9 rxjs reactjs redux ngrx angular

这些库/框架的所有名称都以字母R/N开头或声音非常相似; 保证有刺激性:

react/redux | 通量| ngrx | @ ngrx/store | RxJS/ReactiveX | MVI | ....

任何人都能看透这种疯狂吗? 我想澄清一下,如果我错了,请帮助我:

Redux是JavaScript应用程序的"可预测状态容器"和 Flux的轻量级实现.我可以说:这是Angular2的标准通量实现吗?(但是在没有Angular2的情况下,还有关于redux的精彩视频.)

Flux是Facebook用于构建客户端Web应用程序的应用程序架构.它通过利用单向数据流来补充 React(ReactJS)可组合视图组件.但是,通量只是一种模式,而不是一种实现.

React(ReactJS) Angular2(angular.io)的主要竞争者,尽管它是一个比框架更大的库.

JavaScript的反应性扩展(RxJS)是一个反应式流库,允许您使用异步数据流.它追求"反应宣言"的目标.

Angular2拥有自己的Reactive Extensions,它们被称为Ngrx - Angular2的Reactive Extensions.

然后就是@ ngrx/store这样的东西,它是受Redux for Angular 2应用程序启发的RxJS驱动的状态管理.哎呀-A-菊花!

作为替代助焊剂,安德烈Staltz已提出了单向模型-视图-意图(MVI)架构,基于RxJS观测量,他使用作为基础Cycle.js.虽然Angular 2确实具有双向数据绑定的形式,但它没有规定数据流架构.其中一个销售功能是与模式无关,它将与MVC或Flux架构一起使用.因此,开发人员可以选择合适的模式.>>来源

Woj*_*tek 5

React vs Angular

React只是一个渲染视图的库 - 仅此而且Angular是整个平台.虽然看起来它们可能针对不同的问题,但通常它们都是在使用webapps时做出的选择.

这是为什么?因为您经常将React视为React +整个生态系统(路由器,表单库,状态管理等).

Flux和Redux

你可以看到Flux/Redux经常与React相关联,但这并不完全正确.FluxRedux只是应用程序状态管理的一个概念.然而,Redux(现在最流行的)有它自己的实现,现在是React官方库之一.还有其他助焊剂实施.

反应式编程

这是一种范式.我强烈建议你去通过这个.它很长但是值得.

RxJS和@ngrx

Angular在核心内部使用流,例如管理变更检测.再一次只是流,而RxJS是这个想法的实现之一.@ngrx是一组构建在RxJS顶部的助手.其中一个是Redux启发的状态管理实现,名为@ngrx/store.

MVI

构建由Cycle.js推送的应用程序是一种架构模式(如MVC).这里是一个很好的解释单向UI架构我们安德烈·Staltz谈论-创作者Cycle.js.