BookinglyTech News
Software

Vidact compila componentes React a operaciones DOM directas, sin Virtual DOM

El proyecto traduce componentes de funcion y hooks al estilo React en actualizaciones directas del DOM y elimina el reconciliador del bundle. Esta en beta y nace de un experimento de 2020.

2 min de lecturaConsole.dev0 vistas

Vidact es un compilador que convierte componentes de funcion y hooks escritos al estilo React en operaciones directas sobre el DOM. Los componentes se ejecutan una sola vez, al montarse, y a partir de ahi cada cambio de estado dispara un updater generado en tiempo de compilacion en lugar de volver a correr el componente entero. El proyecto esta en beta y viene de un experimento que su autor empezo en 2020 y dejo aparcado.

El mecanismo es facil de resumir y dificil de implementar: el compilador analiza que expresiones dependen de cada valor y escribe para ellas una funcion de actualizacion. Lo que desaparece del bundle es todo el andamiaje de React: el Virtual DOM, el reconciliador y el seguimiento de dependencias en tiempo de ejecucion. Queda un runtime pequeno que se limita a aplicar esas actualizaciones. En una biblioteca al uso, un cambio de estado recorre crear arbol de elementos, reconciliar y tocar el DOM; aqui el navegador se salta los dos primeros pasos.

Rust y la infraestructura de React Compiler

El compilador esta escrito en Rust y reutiliza la infraestructura de analisis de React Compiler para AST, scope, HIR, CFG, SSA e informacion de dependencias. Vidact aporta su propio IR, su generador de codigo DOM y su runtime. El autor volvio al proyecto, dice, gracias a su trabajo en grep.codemod.com, que le dio un motivo para rehacerlo apoyandose en ese analisis ya existente.

Formularios, listas con clave y ramas condicionales usan el mismo modelo de actualizacion. La documentacion permite comparar un componente con una expansion legible de sus operaciones DOM o cambiar a la salida exacta que genera el compilador.

Vidact Start y el subconjunto que asume

Sobre el mismo modelo, Vidact Start lleva el compilador a SSR e hidratacion y anade rutas de fichero, loaders y navegacion en cliente. La propia web de documentacion corre sobre el.

Lo que no soporta no se degrada: el codigo que no sabe compilar falla en tiempo de build. La respuesta del proyecto no es enviar React ni cambiar a un renderizador mas lento, asi que hoy es un subconjunto deliberado de React. Quien encuentre un patron que deberia compilar puede abrir una issue en el repositorio.

Es el tipo de apuesta que mira con atencion quien mantiene aplicaciones React grandes: sacar el reconciliador y la deteccion de dependencias del paquete final tiene efecto directo en el peso que descarga el navegador y en el trabajo que hace en cada actualizacion. El precio es el subconjunto. Si el compilador no cubre el patron que usas, dentro de Vidact no hay plan B. Que sea beta y dependa del analisis de React Compiler deja la duda en si la cobertura aguanta una aplicacion real y no solo la web de la documentacion.