Snapchat/Valdi

Valdi is a cross-platform UI framework that delivers native performance without sacrificing developer velocity. Write your UI once in declarative TypeScript, and it compiles directly to native views on iOS, Android, and macOS—no web views, no JavaScript bridges.

A basic Valdi component:

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>;
  }
}

Prerequisites: Node.js 18 or later (22 recommended) and, on macOS, Xcode 26.5 or 27. valdi dev_setup installs the rest. See the Installation Guide.

# Install Valdi CLI
npm install -g @snap/valdi

# One-command setup (installs all dependencies)
valdi dev_setup

# Create your first project
mkdir my_project && cd my_project
valdi bootstrap
valdi install ios  # or android

• Getting Started Guide
• Documentation
• Codelabs
• API Reference
• Frequently Asked Questions
• Component Library
• GitHub Discussions
• Roadmap

The apps/ directory contains runnable examples:

Valdi is a cross-platform UI framework designed to solve the fundamental problem of cross-platform development: velocity vs. runtime performance. For 8 years, it has powered a large portion of Snap's production apps.

Unlike frameworks that rely on web views or JavaScript bridges, Valdi compiles declaratively rendered TypeScript components into platform-native views. Valdi also includes several other performance advantages:

• Automatic view recycling - Global view pooling system reuses native views across all screens, dramatically reducing inflation latency
• Optimized component rendering - Components re-render independently without triggering parent re-renders, enabling fast incremental updates
• Optimized layout engine - C++ layout engine runs on the main thread with minimal marshalling overhead
• Viewport-aware rendering - Only visible views are inflated, making infinite scrolling performant by default

Learn more in our Performance Optimization Guide.

Valdi eliminates the traditional compile-test-debug cycle that slows native development:

• Instant hot reload - See changes in milliseconds on iOS, Android, or desktop without recompiling
• Full VSCode debugging - Set breakpoints, inspect variables, profile performance, and capture heap dumps directly in VSCode
• Familiar syntax - TSX components with TypeScript for type safety

Valdi integrates easily into existing apps - start small and scale as needed:

• Embed Valdi in native - Drop Valdi components into existing UIKit or Android view hierarchies
• Embed native in Valdi - Use platform-specific views within Valdi layouts via <custom-view>
• Polyglot modules - Write performance-critical code in C++, Swift, Kotlin, or Objective-C with type-safe bindings to TypeScript
• Full-stack architecture - Build entire features in Valdi with worker threads for background processing, eliminating platform-specific bridge code

Valdi generates type-safe bindings between TypeScript and native platforms:

• Automatic code generation - TypeScript interfaces compile to Kotlin, Objective-C, and Swift bindings
• Native API access - Direct access to platform APIs and third-party native libraries through polyglot modules
• Bidirectional communication - Pass complex data structures and callbacks between TypeScript and native code safely
• Native protobuf support - Seamless integration with protobuf for efficient data serialization

• Powers critical features in production Snap apps.
• Supports advanced animations, real-time rendering, and complex gesture systems

• Flexbox layout system with automatic RTL support
• Worker threads for multi-threaded JavaScript execution
• Native animations for native look and feel
• Advanced gesture recognition with platform-native handling
• Built-in testing framework with component-level unit tests
• Bazel integration for reproducible, incremental builds

• GitHub Discussions — ask questions and share what you're building
• GitHub Issues — report bugs and request features

Please follow the contributing guidelines.

Valdi is made available under the MIT License.