简述Vue3.0提前更新的必要性（vue3更新了哪些功能）

想必大家都知道了，Vue 3.0正式版发布提前了，原本明年才能上线的改成下月了，那大家想过没有，Vue为什么更新的这么快？

近几年，前端发生了翻天覆地的变化，主要是由三大框架的出现掀起了一场“腥风血雨”，到目前也算尘埃落定了。

Vue像一匹黑马，短短几年的时间，力压群雄，成了众多公司和程序员的“新宠”，Github Star 排名荣登第一。所以Vue3.0才会这么备受关注。

很多人可能想问：“Vue3.0一来是不是意味着要重学了？”

可能还会有人想直接飞到尤大身边说：“别更了，我学不动了”。不过也有一些小伙伴始终很从容：“你更新就更新呗，问题不大。”只因他们掌握了正确学Vue的方式。

其实这个不难，首先我们需要明白的是Vue的发展方向，大家有想过这个吗？--Vue为什么要做这一系列更新？是为了解决或是优化哪些问题吗？

我们接着往下说，很多同学都是浮于应用层，所以会觉得学起来吃力，只能跟着跑。但我们记住一句话——懂原理，知底层，任你怎么变化都不怕。

我们简单来做一个分析吧，看看 Vue 1.x 到3.0都做了些什么：

Vue 1.x设计理念

早期 Vue 是采用数据绑定、依赖收集的方式去观察数据变化并保留对实际 DOM 元素的引用，当有数据变化时进行对应的操作。好处是少量数据更新对比 Virtual DOM 性能更好，坏处是大量数据更新、初始渲染性能、对比 Virtual DOM 性能更差。

Vue 2.x设计理念

传统的 vdom 的性能和模板大小正相关，跟动态节点的数量无关。在一些组件只有少量的动态节点的情况下，这些遍历产生了性能浪费。根本原因是 JSX 和手写的 render function 是完全动态的。过度的灵活性导致运行时可以用于优化的信息不足。

所以2.x的优化是，推出了一个区块树（Block tree），如图：

• 将模块基于动态节点指令切割为嵌套的区块
• 每个区块内部的节点结构是固定的
• 每个区块只需要一个Array追踪自身所包含的动态节点

新策略是将vdom更新性能从与整体模块大小相关提升为与动态内容的数量相关。那我们再回过头来看一下，Vue 3.0 的设计目标：

那么，如何做到更快、更小？如何实现上述这些功能？是不是还得从底层入手、看看源码存在的问题？相信大家已经心里已经有个大致的方向了。

技术都有发展变化的规律，我们要做的就是掌握规律，才能占据主动权，不会被牵着鼻子走。离Vue3.0的发布只剩短短的一个月，我们得努把力了，再不抓紧学就落后了。