vue3新特性

一、檢測機(jī)制
  • vue2中基于Object.defineProperty的observer實(shí)現(xiàn)，vue3中則基于Proxy
    的observer實(shí)現(xiàn)
    • 對屬性的添加、刪除動作的監(jiān)測
    • 對數(shù)組基于下標(biāo)的修改，對于length修改的監(jiān)測
    • 對Map、Set的支持
    • 默認(rèn)為惰性監(jiān)測
      1、 在2.x版本中，響應(yīng)式數(shù)據(jù)都會在啟動的時候進(jìn)行監(jiān)測，如果數(shù)據(jù)量較大，會有嚴(yán)重的性能消耗
      2、 在3.x版本中，只有應(yīng)用初始可見部分所用到的數(shù)據(jù)會被監(jiān)測到
    • 更精準(zhǔn)的變動通知：
      1、在2.x版本中，通過Vue.set強(qiáng)制添加一個新的屬性，所有依賴這個對象的watch函數(shù)都被執(zhí)行一次
      2、在3.x中，只有依賴這個具體屬性的watch函數(shù)被通知
    • 更好的調(diào)試：
      1、通過使用新增的renderTracked和renderTriggered鉤子，可以精確的追蹤到一個組件發(fā)生重新渲染的觸發(fā)時機(jī)及原因
    • 暴露出observable的api來創(chuàng)建響應(yīng)式對象，可以替代掉event bus,做一些跨組件的通信
二、性能優(yōu)化
  • 組件渲染：
    1、在2.x版本中，父組件重新渲染時，其子組件也必須重新渲染(前提是修改的數(shù)據(jù)是子組件的props，才會觸發(fā)子組件的重新渲染)
    2、在3.x版本中，可以單獨(dú)重新渲染子組件或者父組件
  • 靜態(tài)樹提升
    1、 在3.x版本中，編譯器可以檢測到靜態(tài)組件，將其提升，降低渲染成本
  • 靜態(tài)屬性提升
三、合成API(Composition API)
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容