Render函數是Vue2.x版本新增的一個函數；使用虛擬dom來渲染節點提升性能，因爲它是基於JavaScript計算。通過使用createElement(h)來創建dom節點。createElement是render的核心方法。其Vue編譯的時候會把template裏面的節點解析成虛擬dom；
什麼是虛擬dom?
虛擬dom不同於真正的dom，它是一個JavaScript對象。當狀態發生變化的時候虛擬dom會進行一個diff判斷/運算；然後判斷哪些dom是需要被替換的而不是全部重繪，所以性能會比dom操作高很多。
下面看一張Aresn大神總結的一張圖：
- Vue2.x版本中VNode屬性：
tag:當前節點標籤名，
data：當前節點數據對象，
children：子節點數組，
text：當前節點文本，
elm：當前虛擬節點對應的真實dom節點，
ns：節點的namespace( 名稱空間)，
content：編譯作用域，
functionalContext：函數化組件的作用域，即全局上下文，
key：節點標識，有利於patch優化，
componentOptions：創建組件實例時的options，
child：當前節點對應的組件實例，
parent：組件的佔位節點，
raw：原始html，
isStatic：是否是靜態節點，
isRootInsert：是否作爲跟節點插入，若被包裹的節點，該屬性值爲false，
isComment：是否爲註釋節點，
isCloned：是否爲克隆節點，
isOnce：是否只改變(渲染)一次，或是否有v-once指令；
其中這裏面又有幾種VNode類型：
Aresn大神總結的很好：
TextVNode：文本節點，
ElementVNode：普通元素節點，
ComponentVNode：組件節點，
EmptyVNode：空節點，或者說是沒有內容的註釋節點，
CloneVNode：克隆節點，可以是以上任意類型節點
說了那麼多；到底什麼時候用虛擬dom才比較好呢？其實 我們使用的單文件組件就已經夠好了。但是當某些代碼冗餘的時候如果寫單文件組件的話會有好多重複的內容；
接下來介紹其核心函數；
- createElement:
createElement接收3個參數：
第一個參數可以是HTML標籤名，組件或者函數都可以；此參數是必須的；
第二個爲數據對象（可選）；
第三個爲子節點（可選）。
附上一個非常簡單的createElement函數demo；
1 var app = new Vue({
2 el:"#app",
3 render:createElement => {
4 return createElement(
5 'h2',
6 [
7 createElement(
8 'a',
9 {
10 domProps:{
11 href:"#biaoti"
12 }
13 },
14 "標題"
15 )
16 ]
17 );
18
19 }
20 });這只是一個createElement函數的使用，而Vue2中VNodeData
class: v-bind/:class
style:v-bind/:style
attrs:dom屬性，如id
props:props,
on:自定義事件等，
nativeOn:原生事件
像這些也可以在render函數中實現，若VNode是組件或含有組件的slot，那麼VNode必須是唯一。
像平常開發過程中單文件組件中template寫法更爲簡單，可讀性也高。如果是webpack進行打包的話template也會預編譯成render函數。
這裏demo栗子暫時還沒寫那麼多。這裏只是一個簡單的介紹。若有更好的歡迎大家一起學習討論。