大家好，我是林三心，用最通俗易懂的話講最難的知識(shí)點(diǎn)是我的座右銘，基礎(chǔ)是進(jìn)階的前提是我的初心~

背景

隨著 React 和 Vue 這些前端框架的爆火，他們的渲染方式，虛擬DOM，也跟著火了起來(lái)，大家都認(rèn)為這是一種高性能批量更新DOM的方式。

但是近一兩年有不同的聲音，覺(jué)得虛擬DOM反而是渲染性能的累贅，所以也出了一些無(wú)虛擬DOM的框架，比如Svelte和SolidJS。

圖片

無(wú)虛擬DOM版的Vue3

最近看到了，Vue 也推出了 無(wú)虛擬DOM 的版本?。?！這是一個(gè)基于 Vue3 的衍生框架，名稱為 Vue Vapor。

倉(cāng)庫(kù)地址是：https://github.com/vuejs/core-vapor

看看描述：Vue Vapor (no virtual DOM) experimental repo.

意思就是，這是一個(gè) 無(wú)虛擬DOM 的框架?。?！

圖片

但是這個(gè)框架還在實(shí)驗(yàn)階段，并且在 Vue Vapor 中還有很多 Vue3 的功能沒(méi)有實(shí)現(xiàn)，在倉(cāng)庫(kù)上，官方列出了功能的實(shí)現(xiàn)清單。

圖片

Vue Vapor 在線演練

由于 Vue Vapor 現(xiàn)階段是實(shí)驗(yàn)階段，還不太好在項(xiàng)目中去使用，但是官方提供了一個(gè)在線的演練網(wǎng)站，可以在上面去體驗(yàn)。

地址是：https://vapor-repl.netlify.app/

圖片

題外話：渲染流程

老生常談的話題，Vue 的基本渲染流程，如果是使用虛擬DOM的話，這里只是說(shuō)一下大概流程，如果想要仔細(xì)了解的話，可以去看我以前的 Vue 文章。

圖片

如果沒(méi)有虛擬DOM的話，那么就去掉 VNode 這一步。

圖片