模型 - 视图 - 控制器（MVC）是软件架构中最广泛和最有影响力的模式之一。尽管MVC的传闻死亡，它仍然是一个有用的模式来理解。在这篇文章中，我将重点介绍它如何演变成我们今天所熟知和喜爱的现代Web框架，而不是控制MVC的各种定义。
盗梦空间
1978年，Trygve Reenskaugh和Adele Goldberg创造了“模型 - 视图 - 控制器”的名称。Trygve相信MVC及其变体形成了一种模式语言，一种让人们谈论问题及其解决方案的共享语言。软件模式语言的概念也影响了Gang of Four编写Design Patterns一书。如果MVC被包含在Design Patterns一书中，我们可能会在Behavioral Pattern部分找到它，并在Mediator和Observer等模式中使用。
这是Trygve在2003年的回顾性论文，MVC，它的过去和现在。Trygve列举了构成MVC模式语言的11种模式。
原生MVC
在接下来的几十年中，随着这些系统的发展和快速发展，MVC在Smalltalk和Mac OS和Windows应用程序中的使用寿命更长。后来，当智能手机开始出现时，Windows Mobile和早期版本iOS的原生移动应用程序也依赖于MVC及其变体。在微软，MVC后来发展成为MVVM，它为WPF，Silverlight和Xamarin等项目提供支持。
Web MVC
在2000年代早期，几个重要的Web框架采用了MVC的模式语言：Spring，Ruby on Rails，PHP和ASP.net。这些框架为Controller添加了新的责任：处理初始HTTP请求。它是这样的：
Controller现在是应用程序的入口点，而不是View。
View的职责也发生了变化：它不是直接向用户呈现内容并处理输入，而是为浏览器组装一组HTML，JS和CSS以进行渲染。
HTML / JS将包含按钮单击处理程序之类的逻辑，它将通过XMLHttpRequest将操作发送回控制器。
请注意，浏览器中没有明显的MVC模式。随着现代网络框架的出现，这很快就会改变。
现代Web框架
随着浏览器大战的解决，我们终于得到了很好的东西：XMLHttpRequest，稳定的DOM API，ES6等。随着这种增强的功能和灵活性，公司开始构建越来越复杂的Web应用程序（有时称为单页应用程序-SPA），而不是相关的简单网页集。现代Web框架有助于组织这种日益增加的客户端复杂性，并使应用程序开发保持可预测和高效。
通常，这些框架引入了额外的构建步骤来创建HTML，JS和CSS的静态包，通过简单的“视图控制器”（通常是/或/index.html处理程序）直接托管。这些资源的静态特性意味着我们可以设置缓存控制头并依赖CDN来帮助以更低的延迟提供服务。这些单页应用程序包含用于针对“API控制器”服务的一组资源发出HTTP API请求的逻辑（在JS中），这些资源通常使用JSON进行响应：
这就把我们带到了今天：React，Vue 和Angular是最受欢迎的现代网络框架。这些框架对MVC的组织模式有多相似？所有都有某种“视图”，因此任何比较都需要在下一层完成：状态（=模型），中介逻辑（=控制器）和绑定同步。
Vue是最直接的：它的文档明确指出Vue是MVVM的一个实现。Angular 默认也是MVVM-ish。然而，React是使用一种名为Flux的超级模式从垂死之星的核心锻造的：
Flux是关于单向数据流的。回想一下，MVC中的Model表示将由View呈现的持久数据。Flux分割MVC模型的职责; 它使用Actions / API来处理业务逻辑，使用“Store”来处理状态。您可以将Store视为整个应用程序的整体被动Passiv模型。
为什么Flux采用单向数据流？理由如下：随着应用程序的复杂性增加，使用视图更新管理状态更改变得越来越困难，特别是如果这些更改来自不同的来源。
与数据绑定相反，View会观察ViewModel的可变实例以进行属性更改，React会创建一个新的View作为不可变State / props的函数，View永远不必担心本地状态的变化。应用程序只能通过在状态树中创建新的Model实例来更改，当React想要更新应用程序时，它会用新对象替换其状态树的一部分，从而触发创建新的View。
虽然单向数据流是一个强大的概念，但它不是一个装满银子弹的免费午餐盒，也不会将React / Flux提升到与Angular / Vue 不同的强大水平。
banq注：作者显然没有从函数式编程去理解React.JS，Angular / Vue还是属于面向对象OO世界，包括MVC模型。