MVC和MVVM
这俩最大的区别其实就是后者多了一个响应式的现代前端框架——以前是控制器去控制页面更新,完全要手操,但现在只要数据变更,框架自动接管,这就是响应式更新。两个V里面,一个仍然是View,而另一个则是ViewModel——这就是一个专门响应式更新页面的分层设计。C不再手动管理页面的更新,完全委托给框架去管理。
而这里的MVVM其实严格来说指的是带有视图和数据绑定的框架,一般的实现都是双向的。但React比较特殊,它的数据流是单向的,而Angular就不太一样。双向绑定确实很爽,但一旦规模膨胀,就会变得非常混乱,有时候我不希望数据被双向更新——而React从一开始的设计里面就要求你手动实现,也算是一种强制你去管理,但牺牲了便捷性。
Angular的新特性Signals其实挺值得一说的。乍看之下它这个跟React 的状态机制很像,都是根据数据变动只更新特定的和该数据有关的界面,但两者的原理很不同。R那里是依赖一个vDOM,每次更新其实都要diff比对一边,规模大了下来是有性能开销的。但A这里的信号就是直接定位到DOM去更新,根本不用比对。信号在这里本质上是一个绑定到DOM的订阅,就好像我跟你之间的约定,数据变了我就直接通知你,而不需要每次所有人都问一遍去比对。
后端的MVC则是指的是当前的标准结构:Models、Controller、Service。分别负责定义资料结构,HTTP预处理和分流,以及实际的业务处置。这个跟前端其实差不多,最大区别其实是V由C来控制,把东西在后端搞好之后,抛到前端去。所以最开始两者是一体的。到后面Web应用越来越复杂,这一套才被直接搬到前端去,V在这里从整个html变成了直接操作的DOM对象。但就因为数据层和渲染层的交互特别麻烦,后续才有了各种框架诞生,将单纯的M和VM区分开来,因此才延展出了两个V(其中一个是对V的映射,即ViewModel)的MVVM,而数据变动导致的渲染更新则交给架构中的状态来专门管理,不再由C直接操作。C的职能从这里被拆分出去,在不复杂的情况下根本不用单独加,而更复杂的时候则成了统一管理状态的部分。