React
React和Vue有很多相似點咆课，他們都有以下特性：
- 利用virtual DOM
- 提供響應(yīng)的可組合的視圖組件
- 專注于核心庫结闸，路由和全局狀態(tài)管理由與之協(xié)同工作的庫處理
性能概述
在目前為止我們測試過的所有現(xiàn)實場景中，Vue的性能都大幅優(yōu)于React（通常至少快20-50%，甚至有些情況下還要快的多）。
渲染性能#####
在React中慧起，我們假設(shè)渲染一個元素的開銷是1，平均每個組件的開銷是2驯绎。在Vue中完慧，渲染一個元素的開銷可能只有0.1，但由于建立響應(yīng)式系統(tǒng)的必要步驟剩失，平均每個組件可能將是4屈尼。
在極端情況下，比如使用一個普通的組件去渲染每個元素拴孤，Vue可能會更慢脾歧。然而，Vue和React都提供了函數(shù)式的組件去解決類似的情況演熟。在本文截稿前鞭执，React計劃為函數(shù)式組件提升性能司顿，使他們近似等于所有元素的開銷。Vue的函數(shù)式組件早已進行了這種優(yōu)化兄纺，因此當(dāng)我們使用函數(shù)式組件時大溜，Vue在這種場景下應(yīng)當(dāng)快大約20倍，但是在React優(yōu)化組件之后僅僅快了10倍估脆。
刷新性能#####
在React中钦奋，你需要在各個地方實現(xiàn)shouldComponentUpdate，并使用immutable數(shù)據(jù)結(jié)構(gòu)去實現(xiàn)完全優(yōu)化的重新渲染疙赠。在Vue中付材，一個組件的依賴自動被追蹤，因此它僅僅在其中一個依賴改變的時候才刷新圃阳。有時候有一種唯一有用的優(yōu)化措施就是給長列表的每一項添加key屬性厌衔。
這意味著在同樣未被優(yōu)化的情況下，Vue中的刷新性能事實上比React更好捍岳。由于在Vue中被優(yōu)化的渲染性能富寿，甚至即使React在優(yōu)化之后通常也會比Vue更慢。
開發(fā)#####
顯而易見锣夹，生產(chǎn)環(huán)境中性能是最重要的作喘，這也是我們到此為止正在討論的。性能在開發(fā)中依然舉足輕重晕城。Vue和React在大多數(shù)應(yīng)用的開發(fā)中都足夠的快。
然而窖贤，如果你正在編寫一些高性能數(shù)據(jù)可視化或者動畫砖顷，你可能發(fā)現(xiàn)一些Vue不能處理超過10fps的場景，這在開發(fā)中很有幫助赃梧。而React甚至調(diào)低至1fps滤蝠。
這是React大量不變的檢測造成的，這種檢測可能有助于React提供許多有用的警告和錯誤信息授嘀。我們認同這些在Vue中同樣重要物咳，但是當(dāng)我們實現(xiàn)這些檢測的同時嘗試去保持性能。
HTML&CSS#####
在React中蹄皱，一切都是JavaScript览闰。如果不深究的話，你會感覺它簡潔而優(yōu)雅巷折。不幸的事實是压鉴，在JavaScript中再造HTML和CSS會造成很多困擾。在Vue中锻拘，我們完全擁抱web技術(shù)并構(gòu)造于之上油吭。為了向大家說明這句話的意思击蹲，我們將舉幾個例子。
- JSX vs Templates
在React中婉宰，所有的組件在render函數(shù)中使用JSX（一種用JavaScript寫的申明式的類XML的語法）來描述UI歌豺，舉個例子：
render () {
let { items } = this.props
let children
if (items.length > 0) {
children = (
<ul>
{items.map(item =>
<li key={item.id}>{item.name}</li>
)}
</ul>
)
} else {
children = <p>No items found.</p>
}
return (
<div className='list-container'>
{children}
</div>
)
}
在Vue中，我們也提供了render函數(shù)心包，甚至也支持JSX类咧，因為JSX這種支持完全編程的特性有時會有用，雖然我們通常并不推薦在組件中使用render函數(shù)谴咸。
作為替代轮听，我們提供了templates：
<template>
<div class="list-container">
<ul v-if="items.length">
<li v-for="item in items">
{{ item.name }}
</li>
</ul>
<p v-else>No items found.</p>
</div>
</template>
以下是使用template的好處：
- 寫模板對于我們在書寫風(fēng)格上無需多做改變
- 模板總是申明式的
- 一些合法的HTML語法在模板中也可用
- 讀起來更像英文（比如 for each item in items）
- JavaScript代碼可讀性更好
使用模板不僅讓開發(fā)者寫起來更容易，而且設(shè)計師和經(jīng)驗尚淺的開發(fā)者也會發(fā)現(xiàn)分析岭佳、貢獻代碼更簡單血巍。
不止如此，通過使用HTML珊随，Vue允許你在模板匯總使用諸如Pug(原名Jade)之類的預(yù)處理器述寡。
React生態(tài)系統(tǒng)也有一個項目(react-templates)允許你使用模板，但是這個東西有一些缺陷：
- 遠沒有Vue的模板系統(tǒng)那么多特性
- 它要求HTML從組件文件中分離
- 由于是第三方庫而不是官方支持的叶洞，它可能不會保持和React核心的更新同步
組件內(nèi)CSS#####
未完待續(xù)......
原文地址：http://rc.vuejs.org/guide/comparison.html
作者：尤雨溪(Evan You)
譯者：熊賢仁
