MVC死了，下一个是什么？

React.js，Elm，cycle.js和其他UI 框架提出了一种新的方式构建用户界面。引入函数式响应式编程模型到用户界面开发，他们甚至改变了我们如何看待用户界面。

无论如何，这些方法已经摧毁了MVC和它的分支（MVP，MVVM等）的优势。这篇文章中，将简要介绍一下这种构建UI新方法，并列举其具有的优势。现在我们看看MVC时代是如何结束的。

使用Redux架构, Elm和Cycle.js的react.js都是彼此不同的。Redux更注重函数式编程。Elm的应用程序有自己的语言，而 cycle.js应用是由响应流以惊人的方式组合在一起。

但这些现象背后，所有这些框架具有一个共同的本质： 函数式响应界面开发。

函数式响应界面由四个数据结构组成：State, 虚拟DOM, Event和Action，以及四个组件：View()-Function, DOM-Driver, ActionCreator和Updater。Dom-Driver是由框架提供，而其他组件由开发者实现。

让我们假设 我们的应用程序中，一个待办事项列表，已经运行了一段时间，用户在待办事项列表按下一个按钮来创建一个新条目。这将导致DOM中按钮单击事件，这是由DOM-Driver抓获并转发给我们的一个ActionCreators。

ActionCreator获得DOM-event事件并把它映射到一个action。action是命令模式的一个实现，即他们描述什么是应该被执行的，但不会改变自己 。在我们的例子中，我们创建了一个 AddToDoItemAction并传递给Updater。

Updater包含应用逻辑，它保持一个对应用程序当前状态的引用。每次收到来自一个ActionCreators的action，它就会产生新的状态。在我们的例子中，如果当前状态包含三个代办事项，我们收到AddTodoItemAction，Updater程序将创建一个结合现有全部事项再加上新的代办事项的一个新的状态。

这个状态被传递给View()-Function，创造了所谓的虚拟DOM。顾名思义，虚拟DOM是不是真正的DOM，但它是一种数据结构，描述了 DOM看起来应该像什么样。

虚拟DOM通过DOM-Driver更新DOM和等待下一个用户输入。本轮周期结束。

这样做好处有三个：
1.简单的测试：
View()-Function 和 ActionCreators是简单的映射, 而Updater基于它接受的Action执行fold (或称为reduce) .
所有的组件都是纯函数和纯函数是非常容易测试。
一个纯粹的函数的结果只取决于输入参数，他们没有任何副作用。要测试一个纯函数，只要创建输入参数，运行“测试中的功能”，并比较结果。没有模型，不需要依赖注入，没有复杂的设置，无需必要的其他技术， 把测试变成乐趣。

2. 综合事件流：
响应式编程有很多的乐趣。图形用户界面的控制流是基于事件的。应用能够响应按钮点击、键盘输入和其他 来自用户或服务器事件。 运用响应技术，数据绑定、观察者模式，或反应流，一切都变得自然。

不幸的是，这些技术是有代价的。 如果一个组件调用一个组件B，这是简单的在你的IDE或调试器看到连接。但如果两者都是通过事件的关系并不明显。 较大的应用会变得越难理解其内部构件。

通过定义所有组件必须遵循一个简单的事件流可避免这些问题。

无论你的应用程序的规模有多大，事件流永远不会改变。

3.时间旅行
函数式响应应用允许您在时间上来回旅行，至少可以在应用程序的上下文中这样做。如果我们存储初始状态和所有操作Action，我们可以使用一种称为“事件源Event Sourcing”的技术。通过重放那些被保存的Action，我们可以重新计算应用每个状态。

http://blog.netopyr.com/2016/10/11/mvc-dead-comes-next/

[该贴被banq于2016-10-14 14:33修改过]