为什么模板竟然是一种功能？

Question

当我学习Vue.extend（）时出现问题。

有什么区别

<div><span style="font-family: Socicon">&#xe028;</span>Facebook</div>

和

var com = Vue.extend({
    template:'<div>111</div>'
})
var com2 = new com().$mount();
document.getElementById('test').appendChild(com2.$el);

第一个在'test'div中给了我一个函数字符串，就像

var com = Vue.extend({
    render:createElement => {
        return createElement('div',{
            domProps:'222'
        })
    )
})
var com2 = new com().$mount();
document.getElementById('test').appendChild(com2.$el);

同时，第二个给出了一个普通的div节点。

<!--function(e,n,r,o){return Xn(t,e,n,r,o,!0)}-->

但是当我尝试FiddleJs中的第一个时，它的工作原理相同。
两者之间有什么区别？