render函數是Vue中非常強大的一個特性，它可以讓我們在JavaScript代碼中直接編寫模板，而不需要依賴于template標簽。

在Vue中，render函數的作用是將組件的數據轉換成虛擬DOM節點，然后再將其渲染到頁面上。而render函數的返回值就是這些虛擬DOM節點。

Vue還提供了一個非常方便的方式來加載圖標，那就是使用iconfont。iconfont是一種能夠將圖標打包成字體文件的方式，這種方式不僅可以減少頁面加載時間，還可以很方便的進行圖標的管理和維護。

// 引入iconfont
import './assets/iconfont/iconfont.css'
// 創建Vue實例
const app = new Vue({
el: '#app',
render(h) {
return h('div', [
h('i', { class: 'iconfont icon-shouye' }),
h('span', '首頁')
])
}
})

在上面的代碼中，首先我們需要通過import語句來引入iconfont。然后在render函數中，我們將i標簽的class屬性設置為iconfont和icon-shouye，這樣就可以使用icon-shouye圖標了。

不過，在實際的開發中，我們可能需要經常使用某些圖標，如果每次都手動輸入類名，那肯定不太優雅。這時我們可以自定義一個Icon組件，然后在其中封裝好常用的圖標。

// 引入iconfont
import './assets/iconfont/iconfont.css'
// 定義Icon組件
const Icon = {
props: {
name: {
type: String,
required: true
}
},
render(h) {
return h('i', { class: ['iconfont', `icon-${this.name}`] })
}
}
// 創建Vue實例
const app = new Vue({
el: '#app',
render(h) {
return h('div', [
h(Icon, { props: { name: 'shouye' } }),
h('span', '首頁')
])
},
components: {
Icon
}
})

在上面的代碼中，我們通過定義一個名為Icon的組件，并將其注冊到Vue實例中，這樣我們就可以在頁面上使用Icon組件了。而在Icon組件中，我們通過props屬性來定義name屬性，并在render函數中動態設置i標簽的class屬性，這樣我們就可以方便地調用圖標了。

通過上面的代碼，我們可以看到，使用Vue和render函數配合使用iconfont非常方便，而且代碼也非常簡潔。我們可以將常用的圖標封裝成組件，并在頁面中使用，這樣就可以提高代碼的可讀性和可維護性。