首頁  >  文章  >  web前端  >  vue和react中dom的區別

vue和react中dom的區別

藏色散人
藏色散人原創
2021-02-03 10:33:103177瀏覽

vue和react中dom的差異:1、vue會追蹤每個元件的依賴關係,不需要重新渲染整個元件樹;2、對於React而言,每當應用程式的狀態改變時,全部元件都會重新渲染。

vue和react中dom的區別

本文操作環境:windows7系統、react17.0.1&&vue2.0版本、Dell G3電腦。

虛擬DOM概念隨著react的誕生而誕生,由facebook提出,其卓越的性能很快得到廣大開發者的認可;繼react之後vue2.0也在其核心引入了虛擬DOM的概念。

什麼是虛擬DOM?

虛擬dom 是相對於瀏覽器所渲染出來的真實dom 的,在react,vue等技術出現之前,我們要改變頁面展示的內容只能透過遍歷查詢dom 樹的方式找到需要修改的dom 接著修改樣式行為或結構,來達到更新ui 的目的。

這種方式相當消耗計算資源,因為每次查詢dom 幾乎都需要遍歷整顆dom 樹,如果建立一個與dom 樹對應的虛擬dom 物件( js 物件),以物件嵌套的方式來表示dom 樹,那麼每次dom 的更改就變成了js 物件的屬性的更改,這樣一來就能查找js 物件的屬性變化要比查詢dom 樹的效能開銷小。

vue和react中虛擬dom的區別

vue和react中虛擬DOM(virtual DOM)是不一樣的。

vue會追蹤每個元件的依賴關係,不需要重新渲染整個元件樹。

而對於React而言,每當應用的狀態被改變時,全部元件都會重新渲染,所以react中會需要shouldComponentUpdate這個生命週期函數方法來進行控制。

推薦:《js基礎教學

以上是vue和react中dom的區別的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn