現在前端框架有兩種數據變動偵測方式,一種是pull,一種是push.
pull 的代表是React ,在進行 setState 操作後顯示更新數據,React 會使用 diff 算法一層層找出差異,然後 patch 到 DOM 樹上,React 一開始不知道那裏變化了,只是知道變化了,然後暴力進行查找那變化了,另一個代表是 Angular 的髒檢查。
Vue 的響應式系統就是 Push 的代表,Vue 初始化的時候就會對 data 的數據進行依賴收集,因此Vue能實時知道那裏發生了變化,一般綁定的細粒度過高,會生成大量的Watcher 實例,則會造成過大的內存和依賴追蹤的開銷,而細粒度過低無法偵測到變化。因此,Vue採用的是中等細粒度的方案,只針對組件級別的進行響應式監聽也就是push,這樣可以知道那個組件發生了變化,再對組件進行diff算法找到具體變化的位置,這是pull操作,vue是pull + push 結合進行變化偵測的。