1.diff算法優(yōu)化

vue2.0 中虛擬dom 是全量對比；vue3.0 中新增了靜態(tài)標記（patchFlag），只對比有PF的節(jié)點，并且通過Flag的信息對比節(jié)點的具體內(nèi)容。
通俗來講就是中解析模板字符串時，將純靜態(tài)元素與動態(tài)元素分開。靜態(tài)元素放在children，動態(tài)元素放在dynamicChildren，diff時只比對dynamicChildren就可以了。

// Block - Block Tree
{
  tag: 'div',
  children: [
    { tag: 'h1', children: 'hello world!' },
  ],
  dynamicChildren: [
    // 所有子元素中動態(tài)的部分哦
    { tag: 'p', children: ctx.text, patchFlag: 1 /* TEXT */ },
  ]
}

2.剪枝 Tree Shaking

剪掉不必要的模塊，沒用到的模塊不會打包到文件中。

3.靜態(tài)樹提升 Static Tree Hoisting

   簡而言之就是做了個緩存，不參與更新的元素只會被創(chuàng)建一次，在下次渲染時直接復(fù)用就可以。那么對于非靜態(tài)元素怎么辦呢？那就看看它的屬性，屬性中的靜態(tài)部分也是可以做靜態(tài)提升的。盡最大可能將可靜態(tài)提升的不分靜態(tài)提升。

4.cacheHandlers 事件偵聽器緩存

    默認情況下onClick 會被視為動態(tài)綁定，所以每次會追蹤它的變化，但是沒有變化，只要緩存起來。下次從緩存里面取就可以了。

5. 基于 Proxy 的觀察者機制

Object.defineProperty是一個相對比較昂貴的操作，因為它直接操作對象的屬性，顆粒度比較小。將它替換為es6的Proxy，在目標對象之上架了一層攔截，代理的是對象而不是對象的屬性。這樣可以將原本對對象屬性的操作變?yōu)閷φ麄€對象的操作，顆粒度變大。

javascript引擎在解析的時候希望對象的結(jié)構(gòu)越穩(wěn)定越好，如果對象一直在變，可優(yōu)化性降低，proxy不需要對原始對象做太多操作。