• 带你简单解读 Vue3


    Vue.js 3.0 "One Piece" 已正式发布,此框架新的主要版本提供了更好的性能、更小的捆绑包体积、更好的 TypeScript 集成、用于处理大规模用例的新 API,并为框架未来的长期迭代奠定了坚实的基础。

    Vue 3.0 的发布标志着此框架整体上已处于可用状态。尽管框架的某些子项目可能仍需要进一步的开发才能达到稳定状态(特别是 Devtools 中的路由和 Vuex 集成),不过现在仍然是开始使用 Vue 3 启动新项目的合适时机。官方还鼓励库作者现在可以开始升级项目以支持 Vue 3。查阅《Vue 3 Libraries Guide》以获取有关所有框架子项目的详细信息。

    快速认识Vue3

    主要改进:

    1、提升运行时性能:重写vDOM

    2、提升网络性能:tree-shaking 机制

    3、完全的 typescript 支持

    4、便利性改进

    5、自定义的 Renderer API

    6、生态圈改进

    一、vDOM 重写

    大幅提升运行时性能:

    什么是vDOM:虚拟DOM元素,提升性能

    效果如何:提升30%-300%

    核心思想:跳过静态节点,只处理动态节点

    性能上,主要是优化了虚拟 DOM,所以也就有了更加优化的编译,同时实现了更加高效的组件初始化。

    二、tree-shaking 机制

    大幅提升网络性能:

    什么是 tree :依赖树,所有的依赖都是 tree 的节点

    如何 shaking :通过代码反向检测哪些特性被用到

    效果如何:只打包必要的依赖项

    三、底层 typescript 支持

    为什么使用 ts :

    强大的类型系统、类型提示:大型应用必备

    Vue3 支持情况如何:完成用 typescript 重写

    开发工具支持:使用 Javascript 也有好处

    四、便利性改进

    方便终端用户使用:

    ·Fragment(碎片): 模板更简单

    • No longer limited to a single root node in templates (<template> 中不再局限于单一的根节点)
    • Manual render functions can simply return Arrays (render 函数可以返回数组)
    • “Just works”

    ·Teleport(传送): 布局更灵活

    • Previously known as <Portal>(原名为 <Portal>
    • More details to be shared by @Linusborg

    ·Suspense(异步加载): 强大的异步组件

    • Wait on nested async dependencies in a nested tree
    • Works with async setup() (与 async 函数 setup() 配合使用)
    • Works with Async Components (与 Async 组件配合使用)

    ·composition-api: 逻辑重用: 代替了mixin

    Composition API 主要是提高了代码逻辑的可复用性,并且将 Reactivity 模块独立出来,这也使得 vue 3 变得更加灵活地与其他框架组合使用。

    五、Custom Renderer API

    • NativeScript Vue integration underway by @rigor789
    • Users already experimenting w/ WebGL custom renderer that can be used alongside a normal Vue application (Vugel)

    自定义 render。我们会提供一个 API 用来创建自定义的 render,因此你不需要为了自定义一些功能而 fork Vue 的代码。这个特性给 Weex 和 NativeScript Vue 这样的项目提供了很多便利。

    六、生态圈支持

    Vue3 相关配套全面升级:

    ·vue-router@next

    ·vuex@next

    ·vue-cli-plugin-vue-next: 生成 vue3 项目的 cli 工具

    ·test-utils@next (测试工具)

    ·DevTools、Vite

    Vue2 呢?

    同时,团队已开始启动 2.7 的开发工作计划,这将是 2.x 的最后一个次要版本。2.7 将向后移植来自 v3 的兼容改进,并会提示有关 v3 中已删除/更改的 API 使用情况的警告。团队表示计划在 2021 年第一季度开发 2.7,发布后将直接变为 LTS 版本,具有 18 个月的维护周期。后面就不再支持2.X的更新了,除非有安全性问题。

    Vue2.7:

    ·融入一部分 Vue3 功能

    ·LTE 支持18个月,之后以安全性更新为主

    尤雨溪:Vue3.0正式全球发布会视频

  • 相关阅读:
    嵌入式开发杂谈
    C#连接数据库
    C软件机密解密之动态跟踪
    navicat连接mysql8报错
    tomcat 服务版本内存设置
    python2/python3 升级pi版本
    各种源文件和目录
    Day 2 : 变量、JAVA基本类型、运算符和表达式1
    猜字母游戏
    Day 1 : 行业概述、JAVA开发环境
  • 原文地址:https://www.cnblogs.com/joe235/p/13813302.html
Copyright © 2020-2023  润新知