一、框架簡介

React主張是函數(shù)式編程的理念， 實(shí)現(xiàn)了前端界面的高性能高效率開發(fā)，react很擅長處理組件化的頁面。React的官方網(wǎng)站提到了“學(xué)習(xí)一次，隨處寫作”這個(gè)關(guān)鍵功能，可以使用React框架在JavaScript中構(gòu)建移動應(yīng)用程序。在 React 中，所有的組件的渲染功能都依靠 JSX，它是JavaScript的語法擴(kuò)展，它在創(chuàng)建UI組件和調(diào)試時(shí)非常簡單有用。

Vue是漸進(jìn)式JavaScript框架。“漸進(jìn)式框架”和“自底向上增量開發(fā)的設(shè)計(jì)”是Vue開發(fā)的兩個(gè)概念。

Vue可以在任意其他類型的項(xiàng)目中使用，使用成本較低，更靈活，主張較弱，在Vue的項(xiàng)目中也可以輕松融匯其他的技術(shù)來開發(fā)。

特點(diǎn)：易用（使用成本低），靈活（生態(tài)系統(tǒng)完善，適用于任何規(guī)模的項(xiàng)目），高效（體積小，優(yōu)化好，性能好）。

二、相同點(diǎn)

都有組件化思想

都支持服務(wù)器端渲染

都有Virtual DOM（虛擬dom）

數(shù)據(jù)驅(qū)動視圖

• 都有支持native的方案：Vue的weex、React的React native
• 都有自己的構(gòu)建工具：Vue的vue-cli、React的Create React App

三、區(qū)別

數(shù)據(jù)流向的不同。react從誕生開始就推崇單向數(shù)據(jù)流，而Vue是雙向數(shù)據(jù)流

數(shù)據(jù)變化的實(shí)現(xiàn)原理不同。react使用的是不可變數(shù)據(jù)，而Vue使用的是可變的數(shù)據(jù)

組件化通信的不同。react中我們通過使用回調(diào)函數(shù)來進(jìn)行通信的，而Vue中子組件向父組件傳遞消息有兩種方式：事件和回調(diào)函數(shù)

diff算法不同。react主要使用diff隊(duì)列保存需要更新哪些DOM，得到patch樹，再統(tǒng)一操作批量更新DOM。Vue 使用雙向指針，邊對比，邊更新DOM

四、適用場景

使用Vue的場景

1.希望用模板搭建應(yīng)用。因?yàn)閂ue.js 使用了基于 HTML 的模板語法

2.希望搭建快速的應(yīng)用。Vue中是雙向數(shù)據(jù)綁定的，無需手動改值。

3.希望應(yīng)用運(yùn)行速度快或是盡快能的小。渲染速度高于React,大小小于React

使用React的場景

1.構(gòu)建大型項(xiàng)目時(shí)。因?yàn)镽eact有更強(qiáng)的測試性，以及可維護(hù)性

2.同時(shí)構(gòu)建Web端和App時(shí)。因?yàn)镽eact Native與React.js大體相同。

3.創(chuàng)建一個(gè)更受歡迎的項(xiàng)目。React較于Vue在國際上使用更廣泛。

五、總結(jié)

Vue的優(yōu)勢包括

• 模板和渲染函數(shù)的彈性選擇， 簡單的語法及項(xiàng)目創(chuàng)建， 更快的渲染速度和更小的體積；

React的優(yōu)勢包括

• 更適用于大型應(yīng)用和更好的可測試性，同時(shí)適用于Web端和原生App，更大的生態(tài)圈帶來的更多支持和工具 。

而實(shí)際上，React和Vue都是非常優(yōu)秀的框架，它們之間的相似之處多過不同之處，并且它們大部分最棒的功能是相通的。

如果想將降低學(xué)習(xí)成本或前端JavaScript框架集成到現(xiàn)有應(yīng)用程序中，Vue是更好的選擇，如果想構(gòu)建大型應(yīng)用項(xiàng)目或者使用JavaScript構(gòu)建移動應(yīng)用程序，React絕對是最好的選擇。

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。