MVVM是Model-View-ViewModel的缩写，是一种基于前端开发的架构模式，其核心是为View和ViewModel提供双向数据绑定，这使得ViewModel的State变化可以自动传递给View，即所谓的双向数据绑定。Vue.js是一个JavaScript库，提供MVVM风格的双向数据绑定，专注于View层。它的核心是MVVM中的VM，也就是ViewModel。ViewModel负责连接View和Model，保证视图和数据的一致性。这种轻量级的架构让前端开发更加高效便捷。为什么会出现MVVM？2015年开始接触MVVM，可以说2015年是MVVM最火的一年。在那之前，我只知道MVC。接触MVC大约是5年前，2011年，当时刚学编程语言和Java，用Java中经典的SSH框架搭建了一个标准的MVC框架。说实话，MVC用了这么多年，但一直没有深入的了解。我只停留在使用层面。直到接触到Vue.js，我才开始研究MVVM架构思想，然后回过头来看MVC。感觉~MVC是Model-View-Controller的缩写，即Model-View-Controller，也就是说一个标准的Web应用是由这三部分组成的：View用于将数据以一定的方式呈现给用户.模型其实就是数据。Controller接收并处理来自用户的请求，并将Model返回给用户。在HTML5还没有普及的年代，MVC作为web应用的最佳实践是可以的，因为web应用的View层比较简单，前端需要的数据基本都可以在后端处理，视图层主要用于显示。当时提倡Controller来处理复杂的业务逻辑，所以View层比较轻量级，也就是所谓的thinclient思想。从2010年到2011年，Html5的概念被炒作和追捧。2012年，W3C正式宣布HTML5规范正式定稿。2013年刚入职时，接触了第一个HTML5框架Senchtouch。它是用于构建移动应用程序的HTML5框架。它完全分离了前后端。前端采用MVC架构，作为一个独立的项目工程维护。.如果使用MVC，为什么要工程化前端？与HTML4相比，HTML5最大的亮点在于它为移动设备提供了一些非常有用的功能，这使得HTML5具备了开发Apps的能力。HTML5App开发最大的优势就是跨平台、迭代快、上线，节省人力成本，提高效率，所以很多企业开始对传统App进行改造，逐渐用H5替代Native。到2015年，市面上的大部分App都或多或少的嵌入了H5页面。由于是用H5构建App，View层做的不仅仅是简单的数据展示，它不仅要管理复杂的数据状态，还要处理移动设备上的各种操作行为等等。所以前端也需要工程化，需要类似MVC的框架来管理这些复杂的逻辑，让开发更高效。但是这里的MVC略有变化：查看UI布局，显示数??据。模型管理数据。控制器响应用户操作并将模型更新为视图。这种MVC架构模式对于简单的应用来说似乎还可以，也符合软件架构的分层思想。但实际上，随着H5的不断发展，人们希望用H5开发的应用能够媲美Native，或者接近原生App的体验效果，所以前端应用的复杂度不同于以往，并且它不是以前的样子。这时，前端开发暴露出三个痛点：1、开发者在代码中大量调用相同的DOMAPI，繁琐冗余，代码难以维护。2、大量DOM操作降低页面渲染性能，降低加载速度，影响用户体验。3、当Model频繁变化时，开发者需要主动更新View；当用户的操作导致Model发生变化时，开发者还需要将变化的数据远程同步到Model中。这样的工作不仅繁琐，而且难以维护复杂多变的数据状态。其实早期jQuery的出现就是为了让前端更简洁的操作DOM，但它只解决了第一个问题，另外两个问题一直是前端存在的。
