无虚拟DOM的框架-Vapor Mode

827 阅读1分钟

这是一个全新的编译策略,还是相同的模板语法一点没有变,但编译后的代码性能更高。利用Template标签克隆元素+更精准的绑定,并且没有虚拟DOM

优点

  • 性能更佳
  • 使用更少的内存
  • 需要更少的运行时支持

如何使用Vapor Mode

可以使用.vapor文件名后缀来启用它

image.png

同一个应用程序中自由混合 Vapor 和非 Vapor 组件

image.png

项目升级

  1. Vapor是一个可选的功能:如果您决定将 Vue 版本升级到包含 Vapor 模式的版本,这不会引入任何与 Vapor 模式相关的重大更改。
  2. Vapor 模式将能够与 vDOM 组件进行互操作:如果你想使用任何像 Vuetify 这样使用 Virtual DOM 的库,Vapor 模式仍然能够支持它

Vapor Mode 的未来

第一阶段:核心功能的运行时

1、支持核心指令 ( v-on, v-if, v-for, etc...) 和组件树。

2、验证性能假设。

3、与现有 SSR 输出的兼容性。

第二阶段:核心功能编译器

1、共享代码生成IR(中间表示) 2、JSX AST / 模板 AST - IR - Vapor Mode code

image.png

第三阶段:整合

1、对独立 Vapor 应用程序的工具支持

2、在现有应用程序中运行 Vapor 组件

3、在 Vapor 中运行 vDOM 组件

第四阶段:功能对等

core-vapor (Vue Vapor(无虚拟 DOM)实验存储库)

core-vapor在开发中 github.com/vuejs/core-…

image.png

参考文档

icarusgk.hashnode.dev/vue-3-vapor…