从项目工程化的角度，谈一下 MVC与MVVM

对于很多编程的初学者来说，MVC 的设计理念和 MVVM 的设计理念总是难以掌握，其实这种现象也属正常，因为很多在初学阶段的人，没有经历大型项目开发的经验，更没有对编程的工程化体系的发展及历史进行过研究，更是少有人提及编程工程化的概念；其实，对于目前的各种设计理念，都是编程工程化发展的产物；

大家可以先看一下图，这基本是我对编程工程化发展的一个了解，以一个大家最习以为常的网站作为工程项目的代表来展示，图中的内容虽然可能并不完善，也不可能完全说明白工程发展的整个历史，这仅仅是一个简易的图示：

正如上图所示，在工程发展的第一个阶段，工程师并没有一个相对明确的分工，基本是出于一种 “啥活都干” 的阶段，在这个阶段中，出现了一种编程语言，他让工程师可以在代码中直接嵌入HTML、CSS、JS等前端代码，可以直接连接数据进行CURD操作，不需要关心数据库的读写压力，可以与现有成熟的HTTP服务器合作，不需要关心客户端的 HTTP 请求压力(不管是数据库还是http服务器，当时的实际压力也没有现今那么大)；

WordPress 将这种开发模式推向了极致，成为混合嵌入式编程的典型代表；Discuz基本算是国内最为典型的代表了；

而随着项目工程量的加大，项目代码的复杂度随之加大，一个人甚至5-10人的小型团队，再也无法适应这种开发模式，于是出现了适应团队协作开发的 MVC 模式，如下图：

MVC设计模式的出现，在一定程度上依赖于另外一项关键技术的成熟，就是模板引擎；

其实模板引擎技术并不复杂，而是繁琐，基本原理就是前端HTML中写关键字符以期承载数据，然后再交由后台将前端HTML代码中的关键字符进行正则匹配，替换为真实数据；

模板引擎的关键点并不是技术，而是在一定程度上解脱了后台程序员，他们不再写页面和JS脚本了，这些工作大部分交给专业的前端工程师来完成，后台只需要在页面完成后读取并交由模板引擎进行二次处理即可；这基本就实现了代码工程的分离；

而MVC的设计模式也是相对灵活的，对于小型技术团队来说，C层与M层的分离其实并不彻底，逻辑与数据之间的处理大部分情况下依然交与后台完成，逻辑层与数据层仅仅实现了代码逻辑上的分离，并没有实现工程上的分离；

但大型技术团队中已经实现了逻辑与数据操作的分离，DBA(数据库工程师)一般会提供数据操作中间件，以供C层根据业务逻辑调用处理数据；

而此时，PHP的优势就显得不是很明显了，大量编程语言出现了同质化的现象，说好听点应该是 百花齐放 ；

目前依然有大量项目在使用MVC的设计模式进行项目开发，而随着移动互联网的发展，MVC 设计模式的最大BUG也凸显出来，它没有从正真意义上实现前后端的分离，而是浅层次的实现了前后端工程上的分离，也就是后台程序员不写页面代码而已；

这种模式，对于移动端设备，完全失去了意义，相同的业务逻辑和数据处理，网站需要一套代码，针对移动设备又需要另外一套代码，工程量翻倍不止；但在MVC的发展道路上，也有人试图突破这种模式已期解决MVC的BUG，但历史证明是不成熟的，就是不使用模板引擎，从服务器获取静态页面后，使用大量的ajax获取数据并更新到页面，这种做法，确实实现了前后端工程及数据的彻底分离，为前端工程化的发展提供了关键性思路设想，

而它最大的BUG就是需要前端程序员大量且繁琐的操作DOM已向用户展示数据，痛苦不堪，虽然jQuery 从一定程度上减缓了这种痛苦，但这并不是MVVM，所以 jQuery 也不是终点，但这种设计是对前端工程化发展具有历史性意义的……

且看下图：

我在上面的图示中展示了两个服务器，是想尽可能的为大家理清 MVVM 在整个项目开发中的作用和关键位置，真实项目开发中，可以是一台或者多台服务器，不要被图示误导；

其实 MVVM的设计，本质上就是解决了前端程序员大量繁琐的操作DOM的问题，数据的请求获取依然依赖于Ajax技术，但是，数据获取后的展示，不再是操作DOM，而是交由中间的VM层来处理；

前端有了MVVM的设计思想后，终于实现了前后端工程及数据的彻底分离，而这种设计思想，目前也大量应用于各种新项目的开发，于是各种前端框架如雨后春笋般拔地而起，前端的ARV三大框架就是典型代表；

前端有了数据处理及展示的独立能力后，后台就可以只针对数据逻辑进行处理了，而这样的后台数据服务设计，不仅适用为网站开发提供数据支持，更适用于为移动端提供数据支持，后台不再需要关心数据展示的问题，也因此有更多的精力来处理并发请求及复杂的数据库 I\O 等问题；，后台也不再需要模板引擎技术，后台 MVC 就变成了 MC ；

也因为有了对MVVM设计实现的这些框架，使前端工程师才有了应有的编程地位，不再是一个缩在角落里听从后台程序员指挥的小角色，大量新项目的开发需要更多的前端工程师，而前端开发也走向了正规的工程化设计开发，目前各大公司对前端程序员的大量需求也得益于此，当然前端工程师的收入也是水涨船高；

另：有一次和一个程序员聊天，他竟然天真的认为MVVM是对MVC的替代升级，我竟无言以对……

当然，如果你看完了还不知道我在说什么，那么我就是在一本正经的胡说八道……

文章首发：https://note.youdao.com/share/?id=f56ff8335c86122ec1e6eaa4208d033a&type=notebook#/cab4cff7705cc2198ff358350e909813

关于作者：https://note.youdao.com/share/?id=f56ff8335c86122ec1e6eaa4208d033a&type=notebook#/A4C7FB8100E1406FA298E9278059D56B

欢迎关注 西岭老湿 微信公众号

欢迎关注西岭老湿知乎专栏：https://zhuanlan.zhihu.com/xilinglaoshi