fervid

用 Rust 编写的全功能 Vue 编译器。目前处于 alpha 阶段，最接近的目标是与当前的 Vue SFC 编译器 达到功能一致性。

入门

如何使用 fervid 在 Vue CLI 和 Vite 中很快就会提供说明！

MVP 进度

此项目的最小目标包括（见 路线图）

• Vue 3 代码生成；
• unplugin 集成；
• Farm 原生插件；
• 支持开发/生产模式；
• 支持 <script setup>；
• 配置的示例 Vue 项目；
• 性能比较。

这是否正确？

此项目使用 Vue SFC 演示平台 作为其参考来比较输出。截至 2023 年 11 月，fervid 能够生成与官方编译器几乎相同的 DEV 和 PROD 代码，只是在以下方面存在一些差异

• 上下文变量。这包括如 {{ foo + bar.buzz }} 或 <div v-if="isShown"> 的用法。fervid 对它们的支持几乎完成。
• [进行中] 补丁标志。这些用于帮助Vue运行时在比较VNodes时。如果一个VNode只有一个动态属性，而其他所有属性和文本都是静态的，则需要将其传达给Vue以实现快速更新。对这些属性的支持正在进行中。

要检查fervid的正确性，可以将沙箱输出与官方编译器的输出进行比较。

请注意，“输出正确性”将取决于Vue的版本，因为Vue团队可能会更改编译器的输出和行为。这对fervid是一个挑战。

它是否快速？

是的，它非常快。实际上，以下是针对测试组件的基准测试运行。

  @vue/compiler-sfc:
    954 ops/s, ±1.15%     | slowest, 98.42% slower

  @fervid/napi sync:
    6 464 ops/s, ±0.08%   | 89.29% slower

  @fervid/napi async (4 threads):
    11 624 ops/s, ±2.12%  | 80.73% slower

  @fervid/napi async CPUS (23 threads):
    60 329 ops/s, ±0.67%  | fastest

注意：结果是在AMD Ryzen 9 7900X上运行的Fedora 38操作系统，内核版本为6.5.9。

在Node.js中的基准测试已使用benny进行，略微修改以考虑libuv线程。基准测试的源代码。

更好的基准测试是一个待办事项，其优先级低于功能完整性和实际场景中的可用性，因此欢迎Pull Requests。

仓库

fervid

主要仓库。它导出一个compile方法，将所有阶段连接在一起，从接收源字符串到输出编译后的代码和资源。对于更细粒度的编译，可以直接使用其他仓库。

fervid_core

跨仓库共享的核心结构和功能。

fervid_parser

基于swc_html_parser的Vue SFC解析器。

fervid_transform

这个仓库负责AST转换。处理<script>和<script setup>分析和转换，以及TypeScript。基于SWC，不使用正则表达式提供快速且正确的转换。

fervid_css

处理<style>块，并启用scoped样式、CSS Modules和Vue特定转换。这个仓库的底层是swc_css_parser。

fervid_napi

NAPI-rs绑定，用于在Node.js中使用。

fervid_deno

适用于Deno使用的Deno绑定。

fervid_plugin 和 fervid_plugin_api

这些crate允许使用动态加载的库（.so、.dll 和 .dylib）在Rust中编写 fervid 插件。这些插件允许任何人自定义Vue SFC的解析、优化和代码生成方式。

路线图

解析器

• 模板解析
• W3C规范兼容性

转换器

• 模板作用域构建
• 错误报告
• JS/TS导入分析（由swc_ecma_parser提供支持）
• setup/data/props 分析
• 处理 <style scoped>
• 支持 <script setup>
  • 绑定收集；
  • 返回语句：内联与渲染函数；
  • defineProps
  • defineEmits
  • defineExpose
  • defineOptions
  • defineSlots
  • defineModel
  • 测试

代码生成器

• 基本的Vue3代码生成

  • 元素
    • createElementVNode
    • 属性
      • 静态 + 动态
      • style 合并
      • class 合并
    • 子元素
  • 组件
    • createVNode
    • 插槽
  • 上下文感知（_ctx，$data，$setup）
  • 指令
    • v-on
    • v-bind
    • v-if / v-else-if / v-else
    • v-for
    • v-show
    • v-slot
    • v-model
    • v-cloak
    • v-html
    • v-memo
    • v-once
    • v-pre
    • v-text
    • 自定义指令
  • 内置组件
    • keep-alive
    • component
    • transition
    • transition-group
    • teleport
    • slot
    • suspense
  • 补丁标志
  • 提升

• DEV/PROD模式

• 热模块替换（HMR）

• Vue 2.7支持

• SSR与内联关键CSS支持

• Vue导入的急切预编译（避免不必要的打包器→编译器调用）

集成

• WASM二进制（未发布）
• NAPI二进制 @fervid/napi
• unplugin（进行中）
• Farm 原生插件
• Turbopack 插件（当插件系统定义时）

lib.rs:

这个crate用于生成SFC的最终模块代码。

这个crate的主要结构是 [CodegenContext]。