1.diff方法優(yōu)化
vue2中虛擬dom通過模板創(chuàng)建虛擬節(jié)點（js對象）,然后使用虛擬節(jié)點跟上一次緩存的虛擬節(jié)點進行全量的對比。
vue3在與上次虛擬節(jié)點進行對比時候穿稳，只對比帶有patch flag的節(jié)點，并且可以通過flag的信息得知當前節(jié)點要對比的具體內(nèi)容
2.hoistStatic 靜態(tài)提升
靜態(tài)節(jié)點進行提升寻拂，靜態(tài)span被拿到函數(shù)體外面程奠，這樣在第一次創(chuàng)建后，后面的節(jié)點會復(fù)用這個創(chuàng)建方法祭钉，免去了重復(fù)創(chuàng)建節(jié)點瞄沙，大型應(yīng)用會受益于這個改動，免去了重復(fù)的創(chuàng)建操作慌核，優(yōu)化運行時候的內(nèi)存占用距境。
3.cacheHandlers 事件偵聽器緩存 [上面的是不使用,下面的是使用的]
不使用cacheHandlers ：onclick是看成一個動態(tài)的綁定,因為綁定的函數(shù)可能會被改變,例如fn本來是data中返回的,之后如果把它替換掉了,這在實際中需要進行一個更新
使用cacheHandlers ： 第一次渲染是自動生成一個內(nèi)聯(lián)的函數(shù),在內(nèi)聯(lián)函數(shù)里面引用當前的fn，然后把內(nèi)聯(lián)函數(shù)隱藏(cache)起來,后續(xù)會從緩存讀取同一個函數(shù)垮卓，因為是同一個函數(shù)就沒有必要追蹤變化垫桂，這樣就把span變成了靜態(tài)的，手寫的內(nèi)聯(lián)函數(shù)也會被cache起來,這樣就會避免一些沒必要的更新.
在組件上使用內(nèi)聯(lián)函數(shù)會受益于這個改動.
4.ssr渲染
當有大量的靜態(tài)內(nèi)容的時候粟按，這些內(nèi)容會被當做字符串推進一個buffer(存儲緩沖器)里面,會通過模板插值嵌入進去,這樣會比虛擬dom來渲染快上很多诬滩。
當靜態(tài)內(nèi)容打到一定量級，會用_createStaticVNode方法在客戶端去生成一個靜態(tài)節(jié)點(static node),會被直接innerHTML,就不需要創(chuàng)建對象灭将，然后根據(jù)對象渲染疼鸟。
變化偵測
ES6之前，js是沒有提供元編程的能力的宗侦，也就是沒有提供可以攔截原型方法的能力愚臀，vue通過覆蓋Array原型的方法忆蚀，來達到做一些自定義操作的目的矾利，比如說發(fā)送變化通知。
vue2中覆蓋了Array原型中的7個方法馋袜，分別是：push男旗、pop、shift欣鳖、unshift察皇、splice、sort泽台、reverse什荣，所以當直接通過索引改變數(shù)組時，vue是追蹤不到變化的怀酷。
所以在vue2中實現(xiàn)數(shù)據(jù)雙向綁定稻爬，是通過Object.definePropertyd劫持各個屬性的getter、setter蜕依，在讀取數(shù)據(jù)時觸發(fā)getter桅锄，修改數(shù)據(jù)時候觸發(fā)setter琉雳。
在getter中收集哪些依賴使用了數(shù)據(jù)，當setter被觸發(fā)時候友瘤，通知getter中收集的依賴數(shù)據(jù)變化了翠肘。
在vue3中改為用Proxy，但是Proxy只能代理一層辫秧，對于深層的無法代理束倍。vue3中利用每次set被攔截之前都會攔截到get操作，所以vue3在get中直接對數(shù)據(jù)進行reactive茶没，這樣就大大減少了遞歸reactive帶來的性能消耗肌幽。
與Object.definePropertyd對比優(yōu)勢：
1. 可以直接監(jiān)聽對象而非屬性
2. 可以直接監(jiān)聽數(shù)組的變化
3. Proxy有多達13種攔截方式，不限于apply抓半、ownKeys喂急、deleteProperty、has等等是 Object.defineProperty不具備的
4. Proxy返回的是一個新對象笛求，可以只操作新的對象達到目的廊移，而Object.defineProperty只能遍歷對象屬性直接修改
————————————————
原文鏈接：https://blog.csdn.net/weixin_39364136/article/details/107743534
