Durante el evento Clojure South, João Lanjoni, Ingeniero de Software en Nubank, abordó un desafío central del desarrollo web moderno: cómo combinar la ergonomía de ClojureScript con la madurez de React para construir interfaces escalables y de alto rendimiento.

Según João, la solución es UIx, una herramienta que representa la nueva generación de puentes que alinean aún más el universo de Clojure con el ecosistema de React. En su sesión, detalló el contexto, las limitaciones de los enfoques anteriores y el valor de UIx como un nuevo y eficiente punto de entrada para desarrolladores de React hacia ClojureScript.

De 2013 a hoy: React y ClojureScript en perspectiva

Desde su lanzamiento en 2013, React ha redefinido la estructura de las aplicaciones frontend al introducir conceptos como la reactividad consistente. La comunidad de ClojureScript respondió rápidamente con interfaces idiomáticas como Reagent, que se convirtió en el estándar de facto gracias a su solidez, proporcionando una interfaz minimalista entre ClojureScript y React mediante una sintaxis tipo Hiccup para definir componentes. Con la llegada de los componentes funcionales y los hooks alrededor de 2019, surgieron nuevas interfaces para permitir el uso directo de estos componentes (en lugar de los antiguos basados en clases).

Sin embargo, a medida que React evolucionó hacia patrones modernos —incluyendo el renderizado concurrente, componentes funcionales y nuevas formas de gestionar el estado—, Reagent se mantuvo ligado a los componentes de clase, principalmente por compatibilidad hacia atrás. Este desajuste resultó en limitaciones de rendimiento en bases de código grandes (debido al procesamiento de Hiccup en tiempo de ejecución), problemas con los componentes funcionales y dificultades en la interoperabilidad con librerías modernas de React como Material UI, Mantine y Ant Design, ampliando la brecha entre ambos ecosistemas.

Descubre las oportunidades

Lo que UIx cambia en tu código

UIx surge para resolver esta divergencia. Al actuar como una interfaz delgada entre ClojureScript y el React moderno, su enfoque es técnico y pragmático: ofrece una capa de abstracción mínima, un rendimiento más predecible y el uso directo de componentes funcionales y hooks. Además, garantiza una interoperabilidad nativa con el ecosistema de React, permitiendo que el ciclo de vida y la gestión del estado sean manejados directamente por React.

Si React ya maneja bien la gestión de estado y el ciclo de vida, ¿por qué no dejar que lo haga?

João Lanjoni, Ingeniero de Software en Nubank.

En lugar de crear un framework completo o añadir abstracciones innecesarias, UIx es un puente ligero que aprovecha lo mejor de React moderno, resultando en una base de código en ClojureScript con sintaxis idiomática pero comportamiento idéntico al de React.

Estructura de componentes en UIx

En términos prácticos, UIx centraliza la construcción de componentes en dos elementos: defui para declarar componentes de React y $ para renderizar elementos de forma explícita y ligera. Los cuerpos de los componentes procesan las props de manera idéntica a React. Los hooks, como useState, se exponen usando las convenciones idiomáticas de ClojureScript, como use-state, mientras UIx se encarga de la traducción a las APIs nativas de React. Esta ergonomía combina lo mejor de la sintaxis de ClojureScript con la arquitectura de React, lo que, según João, elimina la necesidad de capacitar a desarrolladores de React en los detalles internos de capas como Reagent o Re-frame, manteniendo el modelo mental alineado con el estándar de React.

Rendimiento en cifras

Un punto destacado de la presentación fue el gráfico creado por Roman Liutikov (mantenedor de UIx), que compara la profundidad de la pila de llamadas (call stack) al renderizar un componente simple en React puro, UIx y Reagent. React muestra el camino más corto; UIx, al añadir solo una capa delgada, le sigue de cerca. En contraste, Reagent muestra una pila significativamente más profunda debido a que Hiccup se interpreta en tiempo de ejecución. Aunque la diferencia es mínima en aplicaciones pequeñas, el impacto en la predictibilidad y el rendimiento se vuelve notable en productos con cientos o miles de componentes.

Quiénes ya están usando UIx en producción

João presentó tres ejemplos del mundo real, destacados en la página oficial del proyecto:

  • Metosin, Una de las consultoras de Clojure más grandes de Europa.
  • Pitch, Una plataforma de presentaciones con IA y diseños increíbles.
  • Cognition, Una plataforma de e-learning para desarrollo personal.

El caso de Pitch es particularmente impresionante: el equipo migró 2,500 componentes de Reagent a UIx, mantuvo la compatibilidad con Re-frame y observó mejoras en la predictibilidad y el rendimiento.

Por su parte, Metosin cuenta con Juho Teperi, uno de los principales contribuyentes de Reagent, quien creó un proyecto de ejemplo para una app full-stack usando Clojure y ClojureScript y eligió UIx para la interfaz web, utilizando Material UI sin necesidad de wrappers especiales. Cuando alguien que ayudó a construir la herramienta anterior comienza a abogar por el nuevo enfoque, dice mucho sobre el momento actual de la tecnología.

Reduciendo la curva de aprendizaje

El valor de UIx se extiende a la contratación y desarrollo de ingenieros, abriendo paso a que más profesionales entren al ecosistema de ClojureScript sin el requisito de dominar las complejidades de Reagent, Re-frame o el modelo de estado basado en átomos desde el primer día.

“El mayor valor de UIx es permitir que los desarrolladores de React escriban ClojureScript con una curva de aprendizaje mínima.”

João Lanjoni, Ingeniero de Software en Nubank.

Cuándo UIx es la mejor opción

UIx se recomienda especialmente para aplicaciones frontend modernas y complejas, y para equipos que ya están familiarizados con React. Es ideal para bases de código que dependen fuertemente de hooks y para proyectos que requieren interoperabilidad con las últimas librerías de React. La librería, intencionalmente simple, no intenta reinventar la gestión de estado global, manteniendo la compatibilidad con librerías maduras como Zustand y Jotai, o incluso permitiendo el uso de hooks personalizados que se suscriben a un átomo de Clojure.

En esencia, UIx no busca reemplazar a React, sino actuar como un puente delgado, moderno y pragmático. Su objetivo es permitir que los equipos construyan frontends escalables con el poder de React, preservando la expresividad y elegancia de la filosofía de Clojure. Para proyectos complejos y modernos en ClojureScript, UIx podría ser el eslabón perdido.

Descubre las oportunidades