Valdi：Snapchat开源的跨平台UI框架

Valdi是Snapchat开发的跨平台UI框架，已在内部使用8年，现已开源。它允许开发者使用TypeScript编写声明式UI代码，然后编译直接生成iOS、Android和macOS的原生视图，从而实现原生级性能，同时保持高开发效率。

关键要点

• 研究表明，Valdi解决了跨平台开发的经典权衡：它结合了React Native的开发速度和Flutter的性能，但通过直接编译到原生控件，避免了JS桥接的开销，似乎更适合对性能敏感的应用。
• 证据倾向于Valdi在动画和列表渲染上表现出色，但作为新开源项目，其生态仍需时间成熟；与Flutter相比，它更注重原生集成，而非自绘引擎，这可能减少体验不一致，但也限制自定义。
• 存在争议：一些开发者认为Valdi可能颠覆React Native，但其他人指出其beta状态和有限文档可能增加采用风险；总体上，它为大型应用提供了一个平衡选项，但小团队可能更青睐成熟框架。

什么是Valdi？

Valdi是一个开源跨平台UI框架，由Snapchat开发，用于编写声明式界面。它使用TypeScript编写UI组件，编译后直接生成原生控件（如iOS的Swift/Objective-C和Android的Java/Kotlin），性能达到原生级，却能享受热重载和完整调试。一句话：把TypeScript的研发效率直接编译成原生的运行性能，让跨平台第一次真正无妥协。

为什么Snapchat要自己造轮子？

从2016年开始，Snapchat用户增长迅猛，但React Native性能瓶颈（如动画掉帧、列表卡顿）明显；Flutter当时尚未发布，其自绘引擎可能导致与原生组件体验割裂；纯原生开发则需维护iOS/Android两套代码，功能迭代痛苦。于是Snapchat组建团队，使用TypeScript编写UI，编译器直接输出原生控件，绕过JS桥接。内部代号“Valdi”（源自北欧神话的“力量之神”），目标只有一个：实现开发者速度与原生性能的完美平衡。经过8年、200+版本、5000+合并请求，以及日活约4.5亿用户的实战检验（注：2025年数据约为444-460百万DAU，文本中8.5亿可能为MAU约900百万的笔误），Valdi已成为Snapchat的核心工具，现已开源。

快速上手

Valdi的入门门槛低，支持5分钟内运行 demo，支持iOS和Android。

Valdi是Snapchat于2025年11月开源的跨平台UI框架，已在生产环境中使用8年，支撑了Snapchat的大部分功能。该框架旨在解决跨平台开发的根本问题：开发速度与运行性能的权衡。开发者使用TypeScript编写声明式UI，框架会编译生成iOS（Swift/Objective-C）、Android（Java/Kotlin）和macOS的原生视图，无需WebView或JS桥接，从而实现原生级性能，同时保留热重载、调试等现代开发体验。

Valdi的GitHub仓库目前有15.7k星标，528 forks，证明了其初步受欢迎度。它支持嵌入现有原生应用，或在Valdi中嵌入原生组件，还允许使用C++、Swift等语言编写性能关键模块，实现类型安全的多语言集成。

历史与开发背景

Valdi从2016年开始内部开发，当时React Native性能不足，Flutter尚未成熟。Snapchat需要一个能处理复杂动画、实时渲染和手势系统的框架，同时简化跨平台代码维护。经过8年迭代、200+版本更新和5000+合并请求，Valdi经受了Snapchat日活用户（2025年约444-460百万）的考验。开源后，它进入beta阶段，重点改善工具和文档。

核心优势

Valdi的核心优势包括：

• 真原生性能：自动视图回收、独立渲染、C++布局引擎、视口感知渲染，支持无限滚动而无卡顿。
• 开发者体验：毫秒级热重载、VSCode完整调试（断点、性能分析）、熟悉的TSX语法。
• 灵活集成：嵌入原生视图、聚语言模块、自动生成绑定、原生API访问。
• 高级功能：Flexbox布局、工作者线程、本地动画、手势识别、内置测试框架、Bazel构建集成。
• 规模验证：支撑Snapchat关键功能，如动画和实时渲染。

5分钟跑起来：iOS & Android实战

① 前置依赖（一次性）

• macOS需Xcode。
• 安装Valdi CLI：npm install -g @snap/valdi。
• 一键设置：valdi dev_setup（安装所有依赖）。
• 推荐安装VSCode/Cursor扩展，支持语法高亮、调试和日志。

② 创建工程

• 创建目录：mkdir my_project && cd my_project。
• 初始化：valdi bootstrap。
• 安装平台：valdi install ios 或 valdi install android。

③ 写个组件（src/ui/Home.tsx）

import { Component } from 'valdi_core/src/Component';

class HelloWorld extends Component {
  onRender() {
    const message = 'Hello World! 👻';
    <view backgroundColor="#FFFC00" padding={30}>
      <label color="black" value={message} />
    </view>
  }
}

④ 跑起来

使用Valdi CLI运行：valdi run ios 或 valdi run android（推测基于标准CLI用法，官方文档中隐含）。支持热重载，修改即见效。

Valdi vs React Native vs Flutter

以下表格总结了三者的关键比较（基于开源数据和社区讨论）。Valdi作为新人，强调编译到原生；React Native依赖桥接；Flutter使用自绘引擎。

Valdi在性能上优于React Native的桥接模型，与Flutter类似但更注重原生集成。

当前局限 & 风险

Valdi目前为beta状态，工具和文档需更多开源测试；iOS开发需Xcode和macOS；作为新框架，社区小，第三方库少。先在独立模块或小业务试水，避免全盘采用。

写在最后：Valdi能不能成为下一个主流？

有优势，有挑战，但要走出Snapchat的影子，需要社区贡献和生态成长。把TypeScript的研发效率直接编译成原生的运行性能，让跨平台第一次真正兼顾两者。8年实战、约4.5亿DAU、15.7k star，已经把坑踩完。现在，轮到开发者社区来推动它了。

关键引用：

• GitHub - Snapchat/Valdi
• Snapchat Open Sources Cross-Platform UI Framework
• A Look into Valdi: Snapchat's UI Framework
• Valdi – A cross-platform UI framework that delivers native performance
• Snapchat Opens Valdi Framework to Developers After 8 Years
• GitHub README Summary
• Flutter vs React Native: 8 Key Differences
• Snapchat Statistics: Revenue, Users, Downloads (2025)
• Snapchat Surpasses 900 Million Monthly Active Users
• X Post by Simon Grimm on Valdi vs React Native
• X Post by Justin Strong on Valdi differences