- Una alternativa a React Native más rápida y fluida creada por TikTok (ByteDance)
- Lynx es una familia de tecnologías que ayuda a crear UI nativa usando tecnologías web
- Permite responder a múltiples plataformas, como móvil y web, con una sola base de código
- Ofrece programación de UI centrada en el rendimiento y tooling basado en Rust para apps de gran escala como TikTok
- Se decidió liberarlo como código abierto para superar los límites del desarrollo cross-platform existente
Ofrecer apps nativas de gran escala y alta velocidad
- Para los usuarios de apps móviles, una experiencia no nativa genera una percepción negativa
- Pantallas en blanco, retrasos de 0.1 segundos en animaciones, UI inconsistente, etc., reducen la confianza
- Seguir dando soporte a distintas plataformas mientras se construye la misma experiencia sigue siendo un problema difícil
- Lynx permite soportar varias plataformas con una sola base de código, reduciendo tiempo y costos de desarrollo
- TikTok introdujo Lynx de forma gradual y obtuvo resultados exitosos
- Lynx se usa en varias plataformas como TikTok Studio, Shop y LIVE
- Lynx también se utilizó en grandes eventos (Disney100, Met Gala, etc.)
Inspirar a la comunidad web e impulsar su crecimiento
- La plataforma web fue diseñada originalmente con base en documentos, pero ha evolucionado gradualmente hacia una plataforma para desarrollar apps
- PhoneGap (Cordova) y React Native son casos pioneros que conectaron tecnologías web con UI nativa
- Lynx mantiene las fortalezas de las tecnologías web y, a la vez, ofrece un modelo optimizado para el desarrollo de apps mediante restricciones y extensiones claras
- Compatibilidad con tecnologías web: soporte para marcado y CSS
- Extensión y diferenciación: aplica una intención de diseño clara, distinta de la web
Diseño basado en marcado y CSS
- Lynx conserva la familiaridad del estilo de desarrollo web
- Soporta animaciones CSS y efectos de transición
- Permite configurar temas con selectores y variables CSS
- Soporta efectos visuales modernos de CSS como clipping y masking
Uso eficiente del hilo principal
- Procesa los scripts del usuario dividiéndolos en dos runtimes
- Runtime del hilo principal: basado en PrimJS (motor de JavaScript) para el renderizado inicial de la UI y el manejo de eventos prioritarios
- Runtime en segundo plano: ejecuta el código principal del usuario
- Ofrece dos funciones clave
- Instant First-Frame Rendering (IFR): renderiza de inmediato el primer frame → elimina las pantallas en blanco
- Main-Thread Scripting (MTS): maneja con fluidez los eventos de alta prioridad
- La UI basada en Lynx ofrece en promedio un rendimiento de ejecución entre 2 y 4 veces más rápido
Lynx como código abierto
- Lynx fue desarrollado por ByteDance y ya se usa ampliamente en TikTok
- TikTok planea apoyar el código abierto de Lynx y contribuir al fortalecimiento técnico, la activación de la comunidad y el crecimiento del ecosistema
Masificación de la tecnología cross-platform
- El desarrollo cross-platform tradicional ha estado liderado por algunos proveedores principales
- Lynx no ofrece una solución única, sino una meta-infraestructura → permite distintos enfoques
- ReactLynx: soporta componentización estilo React y UI declarativa sobre Lynx
- Ofrece Rspeedy (bundler basado en Rust) → soporta builds rápidas y module federation
- Lynx no depende de un framework específico ni de un backend de renderizado determinado
- Toma inspiración de proyectos como Chromium, Flutter y React Native
- Lynx puede ejecutarse en el navegador → puede expandirse a desktop, TV, IoT, etc.
Un nuevo comienzo
- Lynx ya se usa en producción y se publica en la versión 3.x
- A través del código abierto, planea mostrar un proceso de desarrollo transparente
- Componentes adicionales, renderers gráficos y frameworks se publicarán más adelante
- Busca colaborar con la comunidad open source para superar los límites del desarrollo cross-platform
- Se agradecen el feedback y las contribuciones de la comunidad
3 comentarios
Parece que usar el Lynx Explorer preconstruido sería solo durante la etapa de desarrollo. En la práctica, entiendo que compilar Lynx Explorer requiere esfuerzo.
Me interesa mucho React Native, así que también me da curiosidad esta opción.
El contenido anterior fue tomado de la presentación oficial Lynx: Unlock Native for More.