React 和 Vue 有許多相似之處勺阐,它們都有:
- 使用 Virtual DOM
- 提供了響應(yīng)式 (Reactive) 和組件化 (Composable) 的視圖組件翻擒。
- 將注意力集中保持在核心庫,而將其他功能如路由和全局狀態(tài)管理交給相關(guān)的庫汪拥。
由于有著眾多的相似處达传,我們會用更多的時間在這一塊進(jìn)行比較。這里我們不只保證技術(shù)內(nèi)容的準(zhǔn)確性迫筑,同時也兼顧了平衡的考量宪赶。我們需要承認(rèn) React 比 Vue 更好的地方,比如更豐富的生態(tài)系統(tǒng)脯燃。
運(yùn)行時性能
React 和 Vue 都是非陈蓿快的,所以速度并不是在它們之中做選擇的決定性因素辕棚。對于具體的數(shù)據(jù)表現(xiàn)欲主,可以移步這個第三方 benchmark,它專注于渲染/更新非常簡單的組件樹的真實性能逝嚎。
優(yōu)化
在 React 應(yīng)用中扁瓢,當(dāng)某個組件的狀態(tài)發(fā)生變化時,它會以該組件為根补君,重新渲染整個組件子樹引几。
如要避免不必要的子組件的重渲染,你需要在所有可能的地方使用 PureComponent
挽铁,或是手動實現(xiàn) shouldComponentUpdate
方法伟桅。同時你可能會需要使用不可變的數(shù)據(jù)結(jié)構(gòu)來使得你的組件更容易被優(yōu)化硅堆。
然而,使用 PureComponent
和 shouldComponentUpdate
時贿讹,需要保證該組件的整個子樹的渲染輸出都是由該組件的 props 所決定的渐逃。如果不符合這個情況,那么此類優(yōu)化就會導(dǎo)致難以察覺的渲染結(jié)果不一致民褂。這使得 React 中的組件優(yōu)化伴隨著相當(dāng)?shù)男闹秦?fù)擔(dān)茄菊。
在 Vue 應(yīng)用中,組件的依賴是在渲染過程中自動追蹤的赊堪,所以系統(tǒng)能精確知曉哪個組件確實需要被重渲染面殖。你可以理解為每一個組件都已經(jīng)自動獲得了 shouldComponentUpdate
,并且沒有上述的子樹問題限制哭廉。
Vue 的這個特點(diǎn)使得開發(fā)者不再需要考慮此類優(yōu)化脊僚,從而能夠更好地專注于應(yīng)用本身。