vue3新特性

一、檢測機制
  • vue2中基于Object.defineProperty的observer實現，vue3中則基于Proxy
    的observer實現
    • 對屬性的添加、刪除動作的監測
    • 對數組基于下標的修改，對于length修改的監測
    • 對Map、Set的支持
    • 默認為惰性監測
      1、 在2.x版本中，響應式數據都會在啟動的時候進行監測，如果數據量較大，會有嚴重的性能消耗
      2、 在3.x版本中，只有應用初始可見部分所用到的數據會被監測到
    • 更精準的變動通知：
      1、在2.x版本中，通過Vue.set強制添加一個新的屬性，所有依賴這個對象的watch函數都被執行一次
      2、在3.x中，只有依賴這個具體屬性的watch函數被通知
    • 更好的調試：
      1、通過使用新增的renderTracked和renderTriggered鉤子，可以精確的追蹤到一個組件發生重新渲染的觸發時機及原因
    • 暴露出observable的api來創建響應式對象，可以替代掉event bus,做一些跨組件的通信
二、性能優化
  • 組件渲染：
    1、在2.x版本中，父組件重新渲染時，其子組件也必須重新渲染(前提是修改的數據是子組件的props，才會觸發子組件的重新渲染)
    2、在3.x版本中，可以單獨重新渲染子組件或者父組件
  • 靜態樹提升
    1、 在3.x版本中，編譯器可以檢測到靜態組件，將其提升，降低渲染成本
  • 靜態屬性提升
三、合成API(Composition API)
最后編輯于 ：
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發布，文章內容僅代表作者本人觀點，簡書系信息發布平臺，僅提供信息存儲服務。