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

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

Join our Discord for support.

Please follow the contributing guidelines.

Valdi is made available under the MIT License.