Video thumbnail

    Vite 作者解读:最新功能详解

    Valuable insights

    1.Vite已成为下一代Web应用的基础设施层: Vite在过去几年中实现了快速增长,每周拥有数千万的NPM下载量,并已成为构建新一代Web应用程序不可或缺的共享基础设施。

    2.JavaScript生态系统存在深层碎片化问题: 生态系统在解析器、转换器、测试运行器等各个层级都存在大量解决方案,这给用户带来了巨大的决策疲劳和复杂性负担。

    3.Roldown的构建旨在解决Vite的依赖重叠问题: 为消除对ES build和Rollup等第三方依赖的重叠职责和效率损耗,Vite的创建者正在构建一个专为Vite设计的Rust打包器Roldown。

    4.OXC提供高性能的底层语言工具链: OXC是用Rust编写的语言工具链核心,包含高性能的解析器、链接器和转换器,为上层工具提供统一、高效的基础支持。

    5.Roldown性能超越现有主流打包工具: Roldown已达到1.0 Beta阶段,不仅兼容Rollup插件,而且在性能上被认为是目前最快的打包器,甚至超越了ES build。

    6.Roldown集成将使Vite成为垂直技术栈: 通过用Roldown替换外部依赖,Vite将形成一个垂直整合的堆栈,允许针对Vite特定需求进行更深入的优化。

    7.Vite+旨在统一JavaScript开发体验: Vite+的概念是构建一个类似于Rust中Cargo的集成工具链,为用户提供一个更连贯、无需频繁选型的开发环境。

    8.Vite+引入专用命令以增强库和测试能力: Vite+将包含如`vite lib`(库打包)、`vite test`(测试)和`vite format`(格式化)等专用命令,以解决特定复杂场景。

    9.TS Down负责高性能的库DTS生成: TS Down现已成为官方库打包器,利用OXC的解析能力实现比TSC快数量级的DTS文件生成,并支持DTS文件打包。

    Vite与JavaScript工具链分析

    Vite项目在过去几年中实现了显著增长,目前每周的NPM下载量超过2900万次,拥有超过1100名GitHub贡献者,并形成了庞大的生态系统,许多知名的公司已在生产环境中使用基于Vite的框架。鉴于其广泛应用,可以认为Vite已经成为下一代Web应用程序的共享基础设施层。面对如此重大的责任,开发团队认识到Vite在当前状态下远非完美,因此着手从根本上对其进行改进。

    Vite当前状态的局限性

    先前观察到的最大问题是Vite仍然依赖于具有重叠职责的不同依赖项。作为一个高级工具,Vite封装了ES build、Rollup以及有时用户依赖的SWC进行转换。这些工具用不同语言编写,在它们之间传递数据会产生效率问题,并且它们在代码打包和转换行为上存在细微差异。因此,团队决定自主构建一个打包器来解决这些内部冲突。

    解决方案:构建Roldown打包器

    为了实现Vite的目标,团队正在构建一个名为Roldown的打包器。在深入研究构建打包器所需的基础设施时,团队意识到Vite面临的挑战实际上是整个JavaScript生态系统碎片化的反映。这促使他们需要选择和整合解析器、转换器、最小化器等所有底层组件。

    JavaScript生态系统的碎片化

    深入探究打包器的底层依赖,可以发现JavaScript生态系统在解析器、转换器、测试运行器、链接器和格式化器等每个层级都存在碎片化现象。对于刚接触JavaScript开发的普通用户而言,面对如此多的解决方案,选择合适的工具会带来极大的决策疲劳。这种缺乏中央指导的状况在生态发展的早期阶段是积极的,它促进了探索和选择的自由,是生态系统发展到如今规模的关键。

    缺乏中央指导的结果是探索的自由和选择的丰富性,这在生态的早期至关重要。

    碎片化的双刃剑与复杂性税

    然而,随着语言的成熟以及在许多问题上达成更多共识和约定,这种碎片化现在对每个人都产生了“复杂性税”。因此,现在是JavaScript需要一个统一工具链的时候了。在4040公司,团队正致力于实现这一目标,旨在为用户提供一个更连贯的体验,减少在挑选不同解决方案上花费的精力。

    统一工具链的四大核心组件

    该公司目前专注于四个主要的开源组件:Vite、V Test、Roldown和OXC。Vite是集成点,V Test可独立用于任何JavaScript项目,Roldown是支持Vite内部操作的打包器,而OXC则位于最底层,是支持所有上层开发的语言工具链。

    组件
    层级
    主要职责
    Vite/V Test
    应用层/集成点
    框架集成与测试
    Roldown
    打包层
    代码打包与优化
    OXC
    语言核心层
    解析、转换、最小化

    Rust开发与OXC的进展

    OXC作为语言工具链的核心,其基础是解析器,该解析器同时定义了所有其他任务(如转换、链接、格式化、最小化和语义分析)所使用的抽象语法树(AST)。OXC还提供了一个符合Node.js规范的解析器(resolver)。目前,最小化器处于Alpha阶段但可用,格式化器仍在开发中。选择Rust来编写OXC和Roldown是因为它在性能上限和内存安全之间取得了良好的平衡,并且拥有活跃的JavaScript工具链生态系统。

    选择Rust的原因与分工

    Rust的成熟生态系统使得寻找库和贡献者变得更容易,并且通过出色的NAPI项目实现了成熟的JavaScript互操作性。此外,其成熟的WebAssembly支持允许将Roldown编译到WASM中,在浏览器内以高性能运行。然而,开发团队并非试图将所有内容都用Rust重写;对于需要持续迭代和灵活性的CLI和高级API层,JavaScript/TypeScript仍然是首选工具。

    OXC的当前开发进度

    • 解析器、链接器、解析器、转换器均已完成。
    • 最小化器性能位居第二,但压缩率优于最快方案。
    • 解析器、链接器、转换器等组件在各自类别中实现了最快性能。

    Roldown的进度与特性

    Roldown的开发已持续一年半,目前处于1.0 Beta状态,意味着用户可以将其作为Rollup的近乎即插即用的替代品,并获得显著的性能提升。Roldown的范围比Rollup大得多,因为它集成了OXC的能力,自带TypeScript/JSX转换、CommonJS转换以及Node.js兼容解析,这些在Rollup中通常需要外部插件支持。

    Roldown超越Rollup的高级功能

    Roldown实现了ES build中存在的tree shaking和define注入等特性,并且包含了Rollup和Webpack用户青睐的高级分块(chunk)拆分功能,甚至还实现了模块联邦支持。团队投入了大量精力确保与ES build和Rollup的行为对齐,通过运行它们的测试用例来最大化覆盖率。

    Roldown是目前所能想到的最快的打包器,在某些核心数量下甚至比ES build更快。

    Roldown集成与性能

    在行为对齐方面,Roldown实现了90%的Rollup插件接口兼容性,这意味着绝大多数Rollup插件可以直接在Roldown中使用,尽管Roldown本身是用Rust编写的。目前最关键的工作是将Roldown完全集成到Vite中,从而取代Vite核心中原有的ES build、Rollup和SWC依赖。

    Vite技术栈的垂直化

    集成Roldown后,Vite将形成一个完全垂直的技术栈,Roldown专为Vite设计,使得开发团队能够提供更多定制化的优化来满足Vite的需求。这种垂直化结构解决了Vite开发服务器中存在的性能瓶颈,这些瓶颈源于对未打包的ESM的依赖,当应用模块数量庞大时,会造成网络瓶颈,导致服务器启动缓慢。

    全量打包模式解决启动延迟

    • 专为处理启动页面负载问题的大型SPA设计。
    • 第一阶段已可用,预计很快将随Roldown的官方发布一同推出。
    • 早期采用者(如Excalagaw)通过简单替换包,构建速度提升了16倍。

    Vite+与Roldown的进步

    Vite+目前仍处于非常早期的阶段,但其核心理念是构建JavaScript领域的“Cargo”,即一个能够满足Rust开发工作流所需的大部分需求的集成工具链。Vite+被设计为现有Vite的无缝升级,用户只需将Vite别名为Vite+即可,所有现有功能将保持不变,但命令行将获得更多强大功能。

    Vite+的集成命令预览

    • `vite lib`:专用于库打包。
    • `vite test` 和 `vite bench`:测试和基准测试。
    • `vite link` 和 `format`:链接和格式化。
    • `vite new`:项目脚手架。
    • `vite task`:单仓任务编排和构建缓存。

    企业级功能与AI集成

    Vite+还将包含GUI开发工具、工作区审计以及面向企业用户的策略执行功能。此外,它很可能会集成一个内置的MCP服务器,实现AI集成。

    VitePlus中的库打包、测试和链接

    库打包是一个复杂的领域,其行为与应用打包截然不同,因此需要专门的命令来处理。TS Down项目现已并入Roldown组织,成为基于Roldown的官方库打包器,是广受欢迎的TS Up的继任者。TS Down集成了TypeScript的DTS生成和打包功能,通过允许OXC生成独立的DTS文件,可以实现比TSC快数量级的纯语法转换。

    TS Down的DTS优化技术

    TS Down引入了一个名为`rollup-plugin-dts`的插件,它使用自定义技术将DTS文件打包成单个文件,这不仅减小了包分发大小,还通过减少TypeScript需要处理的文件数量,加快了消费者的类型检查速度。这些功能将集成到Vite+的库模式中。

    V Test的特性与隔离性

    测试运行器
    默认隔离
    状态共享
    Bun Test Runner
    可能存在全局状态变异影响
    V Test
    是 (强制)
    优先保证正确性,性能有开销

    OXC链接与类型检查集成

    OXC链接器在处理语法链接方面比ESLint快100倍,目前团队正在为其构建JavaScript插件系统,以实现与流行ESLint插件的兼容性。短期目标是将TSL集成到OXC中,以在类型检查期间执行链接规则,从而避免重复运行TSC成本。团队也在研究TSGo的实现,探索高效的Go与Rust互操作性,以便将TSGo诊断集成到链接流程中。

    B-plus的开发计划

    Vite+将具备单仓感知能力,这意味着它将提供类似Turbo Repo的管道、构建编排和缓存机制,并为工作区提供一流的支持和策略执行。此外,还将提供优秀的GUI开发工具,其开发工具由Nuxt开发工具的开发者Anthony Fu负责,确保了工具链的可用性。

    配置一致性与框架定位

    所有命令将共享一个单一事实来源的配置文件,确保模块解析和转换等设置在整个仓库中保持一致。最终目标是将Vite+定位为“框架的框架”。许多元框架(如Remix Router, Redwood SDK)正转向使用Vite插件的模式,未来通过Vite+的插件接口,这些框架将能够挂接到额外的命令,注入链接规则、自定义测试环境和开发工具面板。

    Vite+目前仍处于非常早期的开发阶段。如果用户有兴趣提供反馈,可以通过voice.dev/hello与团队取得联系,团队非常期待听到用户的意见和建议。

    Useful links

    These links were generated based on the content of the video to help you deepen your knowledge about the topics discussed.

    This article was AI generated. It may contain errors and should be verified with the original source.
    VideoToWordsClarifyTube

    © 2025 ClarifyTube. All rights reserved.