摘要:在写下这个标题的时候,我已经做好了被喷的准备🫡。 我知道,在前端这个世界里,聊框架之争,就像在聊哪家烧烤最好吃一样,永远没有标
在写下这个标题的时候,我已经做好了被喷的准备🫡。
我知道,在前端这个世界里,聊框架之争,就像在聊哪家烧烤最好吃一样,永远没有标准答案。
在动笔之前,我想先表明立场:我不是要捧一踩一,两个框架都是我吃饭的家伙,它们都足够优秀,都解决了前端开发中的核心问题。
这篇文章,我想聊的不是性能、不是生态、更不是哪个框架更高贵。我想聊的,是一个非常主观,但又无比真实的感受——作为一名普通开发者,在2026年的今天,我写代码时的丝滑感和体验感。
最近刚从一个长期的React项目,切换到一个新的Vue 3项目,这种感受的差异,强烈到让我觉得,有些话,不得不说。
核心差异:Vue的响应式 vs. React的函数式
聊开发体验,绕不开的就是状态管理和视图更新。我觉得,两个框架最大的区别,根儿上就在这里。
Vue给我的感觉,是自动挡。
它的核心是真正的响应式。我用ref或者reactive把一个数据变成响应式的,然后我在任何地方,只要修改了这个数据,Vue就会像一个贴心的管家,自动帮我找出所有依赖了这个数据的地方,然后精准地去更新它们。
import { ref } from 'vue';
const count = ref(0);
点击了 {{ count }} 次
我只需要关心count++这个业务逻辑。我不需要关心这个按钮组件因为count变了,所以需要重新渲染。这个心智模型非常简单、非常直观。
而React给我的感觉,是手动挡。
React的核心是状态驱动视图。它的工作模式是:当一个组件的state或props发生变化时,它会重新执行整个组件函数,生成新的虚拟DOM,然后再去和旧的做对比(diff)。
这个模式本身没问题,但它带来一个直接的后果:默认情况下,任何一点小小的状态更新,都可能导致整个组件树的大范围重新执行。
为了避免这种浪费,React给了你一堆手动挡的工具:useMemo、useCallback、React.memo。
于是,我们的代码里开始充斥着这样的思考:
这个计算结果开销很大,我得用useMemo缓存一下。
这个函数要传给子组件,为了防止子组件不必要的渲染,我得用useCallback包一下。
这个子组件太‘重’了,我得用React.memo把它整个包起来,做个浅比较。
你看,Vue是默认帮你做好了优化,你基本不用想。而React是默认不优化,它把优化的权力(和责任)完全交给了你。
这导致我在写React时,总有一种分裂感:我一边要实现业务逻辑,一边还得像个性能监控一样,时刻提防着不必要的渲染。这种心智负担,真的很重。
集成体验:Vue的全家桶 vs. React的自由
另一个巨大的体验差异,来自于框架的完整度。
Vue给我的,是一个全家桶。
当我写一个Vue组件时,我有一个.vue文件,里面有写结构,
