当某个状态发生改变的时候，如何只更新与这个状态相关联的 dom 节点？ * angular - 脏检查 * react - 虚拟dom * vue - 虚拟dom 虚拟dom 的解决方式   ## 为什么要引入虚拟dom ### vue 1.0 由于 vue 有变化侦测，所以vue是知道具体哪些状态发上了变化。 Watcher 是存在 Dep 中的。  缺点：每个数据都会有一个 Watcher 来观察状态的变化，对于内存和依赖追踪的开销是很大的。 ### vue 2.0 Watcher 不会对每个数据都进行观察，当状态发生变化时，Watcher 会通知到组件，组件内部通过 **虚拟 Dom** 进行比对，找出需要更新的节点。 疑问：vue2.0 观察对象从之前的对每个数据进行观察，调整到对组件进行观察是怎么实现的？ 依赖改变时，循环调触发依赖Watcher   Watcher 里有 vm ？    ## angular的脏检查 ``` DOM.addEventListener('click', function ($scope) { $scope.$apply(() => userCode()); }); ``` 这个 onClick 的方法体对于 angular 来说是黑盒，它到底做了什么angular并不知道。 angular 通过挨个检查这些元素对应绑定表达式的值是否有被改变，去定点击后是否应该刷新 UI，应该更新哪个 DOM 元素。 ## react 更新视图  当组件的状态改变时，React更新虚拟DOM树。虚拟DOM更新后，React然后将虚拟DOM的当前版本与虚拟DOM的先前版本进行比较