Vue3 发布也有一段时间啦，那么本教程就来简单学习一下 Vue3 ，Vue3 作为一个新发布的版本，其与 Vue2 还是存在一点的区别。例如 Vue 实例的创建，在 Vue2 中使用的是 new Vue，而在 Vue3 中使用的是 createApp() 函数。再比如 Vue3 中的 Template 支持多个根标签，而 Vue2 不支持等。我们会在后续的章节中详细的讲解。
什么是Vue？
首先我们来看一下什么是 Vue，之前已经接触或使用过 Vue 的应该知道，Vue.js 就是一套用于构建用户界面的渐进式 JavaScript 框架，也是一个创建单页应用的 Web 应用框架。
与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还非常容易与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。
相对于 Angular 来说，Vue 更加灵活，它可以让你以期望的方式组织应用程序，而不是任何时候都必须遵循 Angular 制定的规则。且它仅是一个视图层，所以你可以将它嵌入一个现有页面，而不一定要做成一个庞大的单页应用。
Vue3的历程
Vue3.0版本经过了2年多的开发工作- 具有30+个
RFC - 2600多个提交
- 来自99个贡献者的628个拉取请求
- 以及核心仓库之外的大量开发和文档工作
分层内部模块
Vue3.0 核心仍然可以通过一个简单的 <script> 标签来使用，但它的内部结构已经被重新编写成一个解耦模块的集合。新的架构提供了更好的可维护性，并允许终端用户通过 tree-shaking 减少多达一半的运行时大小。
这些模块还暴露了底层的 API，解锁了许多高级用例。
- 编译器支持自定义
AST转换，用于构建时的自定义 (例如构建时的i18n)。 - 核心运行时提供了一级的
API，用于创建针对不同渲染目标 (如原生移动端、WebGL 或终端) 的自定义渲染器。默认的DOM渲染器也是使用相同的API构建的。 [@vue](/user/vue)/reactivity模块导出的函数可以直接访问Vue的反应性系统，并且可以作为一个独立的包使用。它可以与其他模板解决方案 (如lit-html) 配对使用，甚至在非UI场景中使用。
解决规模问题的新API
在 Vue3 中，基于对象的 2.x API 基本没有变化。不过，3.0 还引入了 Composition API——一套新的 API，旨在解决 Vue 在大规模应用中的使用痛点。组成 API 建立在反应性 API 之上，实现了类似于 React 钩子的逻辑组成和重用，比 2.x 基于对象的 API 更灵活的代码组织模式和更可靠的类型推理。
性能改进
Vue3 与 Vue2 相比，在捆绑大小 (tree-shaking 时减少了 41%)、初始渲染 (快了 55%)、更新 (快了 133%) 和内存使用 (少了 54%) 方面都有显著的性能提升。
在 Vue3 中，我们采取了“compiler-informed 虚拟 DOM”的方法：模板编译器执行积极的优化，并生成渲染函数代码，以提升静态内容，为绑定类型留下运行时提示，最重要的是，扁平化模板内的动态节点，以减少运行时遍历的成本。因此，用户可以获得两全其美的效果：从模板中获得编译器优化的性能，或者在用例需要时通过手动渲染函数直接控制。
更好的TypeScript集成
Vue3 的代码库是用 TypeScript 编写的，具有自动生成，测试和捆绑的类型定义，因此它们始终是最新的。Composition API 可以很好地处理类型推断。Vetur 是我们的官方 VSCode 扩展，现在利用 Vue3 改进的内部键入功能支持模板表达式和 props 类型检查。
实验特性
我们为单文件组件 (SFC，即 .vue 文件) 提出了两个新特性：
<script setup>：在SFC中使用Composition API的语法糖。<style vars>：单文件组件中状态驱动CSS变量。
这些功能已在 Vue 3.0 中实现并可用，但仅出于收集反馈的目的而提供。在 RFC 合并之前，它们将保持试验状态。
