让我们来看一下，同样的项目，使用vite作为开发构建工具的Vue3和使用vue-cli的Vue2的运行对比。

构建工具	启动时间	打包时间
vite	135ms	13025ms
vue-cli	1482ms	28186ms

从上面的表格我们可以看到，vite相对比vue-cli来说，启动项目时间缩短达到了10倍，打包时间也明显减小。

同时，Vue3也提高了编译的效率。以往当我们的项目越来越大时，经常是一个小小的改动，甚至需要等待几分钟的编译时间才能看到页面效果。而vite内部使用了Esbuild作为底层的依赖预编译工具，完全发挥了Go语言和多线程的优势，同时利用现代浏览器原生支持ESM特性，完全省略了打包的过程，极大的提高了编译运行的效率（关于vite，我们会在其他章节详细介绍，这里只需要有个印象就可以了）。

除了vite这个新工具以外，从代码层面，Vue3的Composition Api新特性也让我们的项目代码功能结构更加清晰，组件拆分复用更加灵活。

从框架层面，Vue3框架的本身也使用proxy代替Object.defineProperty重新实现了真正的响应式“代理”，并且将渲染逻辑拆分为浏览器渲染和平台无关渲染，这对于我们的跨端，跨框架组合开发来说有着非同凡响的意义，你能想象在React中使用Vue的响应式吗，Vue3就替你创造了这个可能性。

综上可见，Vue3做了如此多的改变，从编译运行、代码语法、框架结构等多个层面同时发力，给研发提供了编译更快、打包体积更小、写法更清晰的直观感受，那我们又有什么理由去拒绝Vue3呢？

如何学习Vue3？

大部分的同学应该都有过Vue的相关开发经验，而且Vue也是流行框架中出了名的简单易学，所以从Vue2到Vue3的升级远远没有想象的那么困难。

相信有部分同学阅读过Vue原理的相关文章，比如响应式的实现原理，使用了Object.defineProperty进行拦截代理等等，而在Vue3中，设计者们对部分功能的原理进行了重构调整，我们在学习的过程中，可以从两个方面来深入剖析。

1. 在纵向上，与Vue2的实现原理进行对比。

这样可以帮助我们深刻的理解Vue3的新特性原理，新语法为什么要这么实现，同时也能更清楚Vue2的缺陷和短板，进一步的拓宽我们的知识面。

如果大家过去只是单纯地使用Vue2，只是根据文档按部就班的进行开发，那么通过Vue3.0再次学习的过程，我们可以从原理到基础api，再到vue-router、Vuex的引入，认真体会下Vue3的渐进式设计。

2. 在横向上，与现有的热门框架React，Angular等对比，深入理解各个框架的侧重点和特色。

这样可以进一步地体会Vue本身的设计理念和均衡的特性，以及各个框架的优缺点，我们可以更好地明白各个框架的定位以及如何去根据项目来选择一个合适的前端框架。

其实每个框架都有自己的核心点，只要抓住框架的几个重点，就像搭帐篷一样，就能支撑起我们自己的框架思维，学会去搭建自己的框架思维，那后面如果再有Vue4，Vue5或者其他新的框架，对于我们来说，都可以很快去接受并使用它们。

小册的结构安排

为了帮助大家更好地完成从Vue2到Vue3的过渡，小册将分为以下几个部分。

第一部分： Vue3新特性的介绍以及与Vue2的纵向对比，带大家熟悉Vue3中新增的内容，并且会深入剖析新增内容的原理部分、新语法的特点，分析相对于Vue2的实现方式，Vue3所具备的优势、设计理念的转变，让大家对Vue3的基础使用有个初步的概念。

第二部分： Vue3如此值得学习，那我们现有的项目要如何升级到Vue3呢？我们会以一个Vue2的项目为例，带大家一起走一遍Vue2项目到Vue3的升级之路，并且会告诉大家如何根据项目的实际情况，来决定是否应该升级。

第三部分： 有了新的构建工具——vite，我们当然不能放过，我们会横向与webpack进行对比，从实现原理层面分析说明vite为什么会这么快，以及vite为了达到“高铁速度”而抛弃了什么。

第四部分： 熟悉了Vue3的新增内容后，最终还是要落到代码上，我们会全面的介绍Vue3的全家桶工具，组件化开发，独立设计一些自己的组件，在过程中我们会介绍更多关于Vue3的进阶用法，并且会逐步引入路由、状态管理等内容，帮助大家感受渐进式的概念。

第五部分： 当我们熟练了Vue3的相关开发后，还需要掌握如何去检测监控我们前端项目的性能，并针对性能瓶颈进行优化，提高我们的代码效率。

第六部分： 我们会介绍前端框架的发展之路，纵向对比其他热门框架，帮助理解Vue的核心理念，并剖析热门框架的核心功能实现原理。

本节是小册的开篇文章，在写这本小册之前，我想了很久，到底想让读者从这个小册中得到什么？是某些网络上已经有各种解答的知识点，还是一套完整的Vue3的进阶教程，这些都是我想说的一部分，但更想带大家一起撬开这些表面的“贝壳”，看一看里面藏着的“珍珠”。

前端已经发展到了一个拥有完整生态圈的成熟阶段，如果想成为一名不被淘汰的研发人员，只会写代码是远远不够的，在写代码的过程中，我们要学会养成自己的思维，认知也要慢慢转变。

从最开始 “哦，原来是这样，我会用了，这个框架很牛啊”。到 “哎？他这里为什么可以做到数据驱动呢，他是怎么做到的？我要来研究下。”再到 “这个框架的设计很巧妙，如果是我，我会怎么设计和实现这个功能呢？” Vue3是一个很好的切入点，在学习Vue3的过程中，我们可以去提炼Vue3的重点和特性，来尝试搭建自己的框架思维。

我希望随着小册的学习，大家都能从中收获到新的东西。下面，我们一起来开始本小册的进阶之路！