最近看到了许多这样的评论:





咱们来问问AI
,让AI
来解释一下为什么会出现这种现象。
ChatGPT

它甚至还贴心的问道:

就是有点太磨叽了:


最后给大家奉上它画的图:

通义千问
有人可能会说 ChatGPT
中文支持到底行不行?毕竟它生成的中文:



所以咱就换国产:



DeepSeek

感觉都是与虚拟 DOM 的对比
咱们问的是为什么前端又流行起来了无虚拟dom?
,重点是"又
",也就是说早就有无虚拟 DOM
了,咱们想问的是无虚拟 DOM
明明被虚拟 DOM
淘汰了,但现在却又死灰复燃了的原因。但感觉这些个 AI
都只说虚拟 DOM
的缺点和 无虚拟 DOM
的优点,咱们重新再来问一下:

ChatGPT


总结
根据各大 AI
给出的答案,咱们已经可以得出无虚拟 DOM
怎么又流行起来了的结论了:
就是早期的无虚拟 DOM
和现在的无虚拟 DOM
压根儿就不是一回事儿,以前那是纯纯的手动操作 DOM
,写过 jQuery
的应该都知道:
js
$('.xxx').class({ xx: xx }).child(1).xxxxxxxxxxx
而现在的无虚拟 DOM
则根本不用自己操作 DOM
,跟虚拟 DOM
时代的写法没什么两样:
html
<template>
<div :class="{ red }">{{ text }}</div>
</template>
<script setup vapor>
import { ref } from 'vue'
const red = ref(true)
const text = ref('')
</script>
<style scoped>
.red {
color: red;
}
</style>
也就是相当于结合了以前手动 DOM
的性能优势(当然大部分人写的时候都没考虑过性能,所以才会被虚拟 DOM
所超越,但要是好好写的话还是可以超过虚拟 DOM
的性能的,不过可维护性就差点意思了)以及虚拟 DOM
的写法优势,这才是现在的无虚拟 DOM
:
手动操作
DOM
的性能 + 虚拟DOM
的写法 = 现在的无虚拟DOM