Vue.js 2.x與vue.js 1.x最大的區(qū)別就在于2.x使用了Virtual Dom(虛擬Dom)來更新Dom節(jié)點(diǎn)，提升渲染性能娇钱。
雖然前面章節(jié)我們的組件模板都是寫在template選項(xiàng)里的开伏，但是在Vue.js編譯時(shí)煌珊，都會解析為Virtual Dom站故。
本章我們就來探索Vue.js用于實(shí)現(xiàn)Virtual Dom的Render函數(shù)語法区宇，在介紹Render函數(shù)前娃殖，我們先來看看什么是Virtual Dom。
9.1什么是Virtual Dom
React和Vue2都使用了Virtual Dom技術(shù)议谷，Virtual Dom并不是真正意義上的Dom珊随，而是一個(gè)輕量級的JavaScript對象，在狀態(tài)發(fā)生變化時(shí)柿隙，Virtual Dom會進(jìn)行Diff運(yùn)算叶洞，來更新只需要被替換的DOM，而不是全部重繪禀崖。
與DOM操作相比衩辟，Virtual Dom是基于JavaScript計(jì)算的，所以開銷會小很多波附。
正常的DOM節(jié)點(diǎn)在HTML中是這樣的：
<div id="main">
<p>文本內(nèi)容</p>
<p>文本內(nèi)容</p>
</div>
用Virtual Dom創(chuàng)建的JavaScript對象一般會是這樣的：
var vNode ={
tag:'div',
attributes:{
id:'main'
},
children:{
//p節(jié)點(diǎn)
}
}
vNode對象通過一些特定的選項(xiàng)描述了真實(shí)的DOM結(jié)構(gòu)艺晴。
在Vue.js2中，Virtual Dom就是通過一種VNode類表達(dá)的掸屡，每個(gè)DOM元素或組件都對應(yīng)一個(gè)VNode對象.
VNode主要可以分為以下幾類：
- EmptyVNode
- ComponentVNode
- TextVNode
- ElementVNode
- CloneVNode
使用Virtual Dom就可以完全發(fā)揮JavaScript的能力封寞。在多數(shù)場景下，我們使用template就足夠了仅财，但在一些特定的場景下狈究，使用Virtual Dom會更簡單，下節(jié)我們來介紹Vue的Render函數(shù)的用法盏求。
9.2什么是render函數(shù)
Render函數(shù)通過createElement參數(shù)來創(chuàng)建Virtual Dom抖锥，結(jié)構(gòu)精簡，代碼少且清晰碎罚，這里使用了一個(gè)demo實(shí)例來說明磅废，我未對實(shí)例進(jìn)行摘抄，我們只有清楚Render函數(shù)所有神奇的地方都在這個(gè)createElement里就可以了荆烈，我們在下一節(jié)來詳細(xì)介紹它的詳細(xì)配置和用法拯勉。
9.3createElement用法
9.3.1 基本參數(shù)
由于對render函數(shù)的不熟悉與學(xué)習(xí)render函數(shù)的興趣下降，于是憔购，到此先暫時(shí)越過這一章節(jié)宫峦。
