Valdi – framework de UI multiplataforma que ofrece rendimiento nativo

 (github.com/Snapchat)
9 puntos por GN⁺ 2025-11-09 | 2 comentarios | Compartir por WhatsApp
  • Valdi, creado por Snap, es un framework de UI multiplataforma que ofrece rendimiento nativo en iOS, Android y macOS, compilando directamente a vistas nativas de cada plataforma una UI escrita de forma declarativa en TypeScript
  • Funciona sin WebView ni puente de JavaScript, y mantiene un alto rendimiento con reutilización automática de vistas, motor de layout optimizado y renderizado basado en viewport, entre otros
  • Acelera el desarrollo con hot reload instantáneo, depuración en VSCode y soporte para sintaxis TSX, además de ofrecer una integración flexible con apps nativas existentes
  • Proporciona una integración nativa profunda con bindings type-safe entre TypeScript y código nativo, soporte para protobuf e interoperabilidad con C++, Swift y Kotlin
  • Es una base escalable para desarrollar UI con funciones avanzadas como animaciones a gran escala, gestos y procesamiento multihilo, respaldada por 8 años de uso probado en apps de producción de Snap

Resumen de Valdi

  • Valdi es un framework de UI multiplataforma que Snap ha usado durante 8 años en apps de producción
    • Si escribes la UI en TypeScript declarativo, la compila directamente a vistas nativas de iOS, Android y macOS
    • Ofrece rendimiento nativo sin WebView ni puente de JavaScript
  • Actualmente está en beta, y planea pasar a una versión estable cuando se complete la estabilización de herramientas y documentación en el entorno open source

Características principales y ejemplos

  • El ejemplo básico de componente muestra una UI simple en la clase HelloWorld usando y
  • Usa una estructura declarativa de componentes basada en TypeScript, y puede ejecutarse con el mismo código en cada plataforma
  • Ofrece recursos para desarrolladores como documentación oficial, guía de instalación, referencia de API y Codelab

Optimización de rendimiento

  • Para asegurar rendimiento nativo, adopta la siguiente arquitectura
    • Reutilización automática de vistas: sistema global de pooling de vistas para reutilizar vistas entre pantallas y minimizar la latencia de inflación
    • Renderizado independiente de componentes: actualiza solo componentes individuales sin afectar el renderizado del padre
    • Motor de layout basado en C++: funciona en el hilo principal con sobrecarga mínima
    • Renderizado con reconocimiento de viewport: infla solo las vistas visibles en pantalla para mejorar el rendimiento del scroll infinito
  • También ofrece la Performance Optimization Guide como documentación relacionada

Experiencia de desarrollador

  • La función de hot reload refleja los cambios de código de inmediato
  • Soporte de depuración en VSCode: permite configurar breakpoints, inspeccionar variables, perfilar rendimiento y capturar heap dumps
  • Ofrece un entorno de desarrollo familiar con sintaxis TSX y seguridad de tipos

Estructura de integración flexible

  • Se puede insertar Valdi en una app nativa existente (Embed Valdi in native)
  • También se pueden usar vistas nativas dentro de Valdi (Embed native in Valdi)
  • A través de módulos Polyglot, se integra de forma type-safe con código en C++, Swift, Kotlin y Objective-C
  • Su arquitectura full-stack permite implementar funcionalidades completas aprovechando hilos worker en segundo plano

Integración nativa

  • La generación automática de código convierte interfaces de TypeScript en bindings para Kotlin, Objective-C y Swift
  • Mediante módulos Polyglot, accede directamente a APIs de plataforma y bibliotecas nativas de terceros
  • La comunicación bidireccional permite intercambiar de forma segura estructuras de datos complejas y callbacks
  • El soporte para protobuf permite serialización de datos eficiente

Estabilidad y funciones probadas

  • Es una tecnología clave que impulsa funciones principales de producción de Snap
  • Soporta animaciones avanzadas, renderizado en tiempo real y sistemas de gestos complejos
  • Incluye varias funciones como layout Flexbox, workers multihilo, animaciones nativas, reconocimiento avanzado de gestos, framework de pruebas integrado y builds integrados con Bazel

Soporte y licencia

  • Ofrece soporte a través de la comunidad de Discord
  • Está publicado bajo licencia MIT, lo que permite uso y contribución libre

Lecturas relacionadas

2 comentarios

 
GN⁺ 2025-11-09
Opiniones en Hacker News

  • En nuestra empresa usamos React Native, y de verdad deseamos el fin de las diferencias entre la App Store y los lenguajes de cada plataforma
    El próximo año estamos considerando simplemente basarnos en el sitio web y envolver la app móvil con WebView, dejando solo funciones como notificaciones, GPS y HealthKit en código nativo
    Últimamente, gracias a la IA, hasta me da la impresión de que quizá sea mejor hacer la UI por separado para cada plataforma

    • Yo hice eso mismo y no me arrepentí. Esto es lo que normalmente llaman una “app WebView”, pero puede ofrecer una experiencia bastante buena en cada plataforma
      La clave es no hacer los componentes de UI demasiado peculiares, y ajustar solo un poco cosas como el estilo de los botones o el back stack según la plataforma
      Además, agregué funciones offline con Service Worker e hice que herramientas de diagnóstico de red se ejecutaran al iniciar la app para poder detectar problemas rápidamente
      Eso sí, mi app era para B2B, así que esta configuración era viable
    • Aun así, si de todos modos tienes que envolver WebView en un contenedor nativo, para ese punto ya entraste al infierno de la firma de código en iOS
      Creo que la web existe justamente como una forma de evitar la App Store y la firma de código
      La mayoría de las funciones también se pueden hacer en web, y HealthKit podría resolverse con una app complementaria aparte
      Puede que promocionar códigos QR o enlaces con presupuesto de marketing sea mucho más eficiente que competir en la App Store
    • Yo también intento algo así cada 10 años. Al principio uno se enamora de la velocidad de desarrollo, pero después termina pagando el precio en cosas como la integración de nuevas funciones del SO o el manejo de gestos
      Sobre todo en iOS, en el momento en que no funciona el gesto de “deslizar para volver”, enseguida te das cuenta de que es un WebView
    • La IA no va a cambiar las guías de Apple
      Yo escribo la UI de negocio una sola vez y uso un LLM para convertir entre React Native y React
      Pero Apple sigue manteniendo la regla 4.2 de funcionalidad mínima, que dice que “las apps que solo empaquetan un sitio web serán rechazadas”
    • Escribir tres veces una app compleja y de largo plazo, una por plataforma, es casi una pesadilla
      Hay que sincronizar funciones y pruebas en las tres plataformas, y además los desarrolladores deben dominar varios stacks
      La mayoría de los usuarios casi no nota la diferencia entre una buena implementación con WebView y una app nativa, pero el costo es demasiado alto

  • Valdi se ve conceptualmente parecido a React Native
    Ahora ya hay tres frameworks cross-platform basados en React: React Native, Lynx.js (ByteDance/TikTok) y Valdi
    La competencia es buena, pero no estoy seguro de que puedan construir tan rápido un ecosistema tan grande como el de RN
    RN ha tenido muchos avances este año, como mejoras al motor Hermes, generador de bindings nativos, animaciones multihilo y soporte para Tailwind
    Lynx.js podría tener ventaja por su intención de soportar frameworks además de React

    • Busqué un poco más y parece que Valdi da soporte completo para depuración en VSCode
      El IDE Radon de RN es de pago, pero Valdi es open source
      También me parece interesante que Valdi use el motor Hermes de RN
      Al ver la documentación relacionada, me da curiosidad cómo implementan AOT/JIT

  • Hace tiempo ayudé a depurar una versión inicial de este proyecto en Snap (Screenshop!)
    Simon era un gran ingeniero, y de verdad me alegra que este proyecto se haya hecho público
    Felicidades al equipo de Snap

    • Me sorprendió que una app tan simple como Snap invirtiera en un framework de UI cross-platform
      Como es una app donde son importantes las integraciones nativas como cámara, AR, notificaciones y detección de capturas de pantalla, sorprende aún más
    • Incluso en ese entonces ya era un proyecto realmente genial, y recuerdo que el objetivo era hacerlo open source
      Me alegra que eso se haya vuelto realidad
    • Yo también intenté hacer un port a web trabajando con Simon, pero fracasó
      Es una persona realmente brillante, y felicidades a todo el equipo
    • Me pregunto si hoy en día usaría este framework en un proyecto real
    • Me viene a la mente el nombre “Composer”

  • Un framework de UI hecho por Snapchat con una comunidad en Discord no me atrae en absoluto, personalmente

    • Últimamente muchos proyectos están moviendo su comunidad a Discord
      No es perfecto, pero también podrías estar quedándote fuera del rumbo que está tomando el futuro
    • Yo también uso Discord con frecuencia, pero sigo sintiendo que es incómodo como comunidad para trabajo

  • En la documentación dice: “si expones objetos de C++, Objective-C y Kotlin a TypeScript, es Native Reference; al revés, es JS Value Reference”
    Me preocupa un poco que no haya mención de Swift o SwiftUI

  • Sinceramente, me cuesta confiar en un framework hecho por Snap
    Porque la calidad de su app de Android antes era demasiado mala

    • Me impactó enterarme de que antes, en vez de tomar una foto, el método era hacer una captura de pantalla de la vista de la cámara

  • Valdi se presenta como “un framework de UI donde escribes una vez en TypeScript y corre con rendimiento nativo en iOS, Android y macOS”
    Enfatiza que no hay WebView ni puente de JS

    • Bromea con: “Nosotros tenemos ambas cosas. Country and western!”

  • Yo creo que simplemente hay que escribir la UI dos veces en el lenguaje nativo de cada plataforma y compartir la lógica común con FFI de la familia C
    ¿Qué tan difícil podría ser?

    • Nosotros también vamos por ese camino. Por ahora solo soportamos iOS, pero planeamos expandirnos a Android después de obtener feedback de los usuarios
      La mayor parte del equipo usa Android, pero nuestros clientes están centrados en iOS, así que por eso esa prioridad
      He hecho apps con RN, pero sigo esperando una solución cross-platform realmente mágica
    • Yo también estoy de acuerdo. La clave es diseñar una arquitectura que separe la lógica de negocio de la UI
      Así, distintas interfaces como web, móvil, escritorio o CLI se vuelven capas delgadas que simplemente llaman al núcleo
      Lograr una UX perfectamente consistente será difícil, pero a largo plazo puede reducir la dependencia de frameworks de terceros

  • Si te da curiosidad el manejo de estado de Valdi, usa tal cual el estilo de componentes de clase de React
    En el ejemplo de la documentación oficial, la estructura consiste en heredar de StatefulComponent e implementar onCreate, onDestroy y onRender

    • Yo también extraño los componentes de clase de React
      La forma actual de usar decenas de useFunction tiene muchos errores y es compleja

  • Lamentablemente, no soporta Linux, Windows ni HTML como targets
 
clastneo 2025-11-10

En RN, para la mayoría de las apps, la lógica de negocio puede ejecutarse lo suficientemente rápido solo con JS.
Cuando uno se pone a pulir, el problema es que muchas veces el comportamiento difiere según la plataforma, y eso hace que se vuelva desesperadamente difícil encontrar una buena respuesta.