Una pantalla de lista de contratistas en uno de los despliegues de nuestros clientes tiene 38 líneas de JSON. El equivalente en Angular escrito a mano que reemplazó tenía 412 líneas de TypeScript, HTML y SCSS. Mismo comportamiento, misma grilla de datos, misma relación master-detail con la sub-tabla de direcciones. Una décima parte de la superficie.
Esa proporción es la razón por la que nuestro pipeline de generación con IA funciona en producción. También es la razón por la que la mayoría de la UI empresarial generada por IA no funciona.
El problema de generar código directamente
Cuando un modelo genera un componente React, toma cientos de micro-decisiones. Nombres de variables, gestión de estado, enfoque de CSS, manejo de errores, obtención de datos. Ejecute el mismo prompt dos veces y obtendrá dos implementaciones funcionales que no comparten casi ninguna estructura. Para una demo, eso está bien. Para un sistema empresarial en producción, es inaceptable.
Las empresas necesitan reproducibilidad. Necesitan auditabilidad. Necesitan poder señalar una pantalla y demostrar exactamente qué hace, quién puede ver qué y cómo se calculó un número. La generación de código libre no puede ofrecer nada de eso a nivel arquitectónico.
La idea que cambió nuestro enfoque
Pasamos aproximadamente seis meses probando diferentes estrategias de generación antes de llegar a la regla que lo reorganizó todo. No generar la aplicación. Generar la descripción de la aplicación.
Un JSON descriptor especifica qué hace una pantalla. Sus campos, layout, reglas de validación, fuentes de datos, permisos y acciones. No dice nada sobre cómo se renderiza esa pantalla. El framework es dueño del renderizado, de manera determinista, de la misma forma cada vez.
Cómo luce un descriptor en la práctica
Un descriptor típico de pantalla de lista declara el endpoint de la fuente de datos y los parámetros de consulta, las columnas con tipos y comportamiento de ordenamiento, la configuración de filtros y búsqueda, las acciones disponibles y sus requisitos de permisos, y cualquier relación master-detail con otras entidades.
Eso es todo. Sin JSX, sin manejadores de eventos, sin estilos. El framework maneja el renderizado, el cliente de API maneja la red, y la capa de permisos maneja el control de acceso. El descriptor es más fácil de escribir, más fácil de revisar y dramáticamente más fácil de modificar.
Por qué esto importa para la generación con IA
Dirigir el modelo hacia descriptors en lugar de código cambia cuatro cosas a la vez.
Eficiencia de tokens. Un descriptor es aproximadamente 10x más pequeño que el componente equivalente. La generación es más rápida y económica, y la ventana de contexto alberga más del sistema circundante.
Consistencia. El framework renderiza cada descriptor de manera idéntica. No hay deriva arquitectónica entre pantallas escritas el lunes y pantallas escritas el martes.
Revisabilidad. Un product manager puede leer un JSON descriptor y entender la pantalla. No puede leer 400 líneas de TypeScript, y no debería tener que hacerlo.
Comparabilidad de diferencias. Cuando un descriptor cambia, el diff muestra el cambio semántico real. “Se agregó columna Priority, tipo select, opciones High/Medium/Low.” Ese es un artefacto significativo para un revisor humano o un auditor SOX.
La válvula de escape
Los descriptors no son universales. Algunas pantallas necesitan componentes personalizados, layouts inusuales o comportamientos que el framework no anticipa. Manejamos eso con una sola regla: cualquier descriptor puede referenciar un componente personalizado escrito en TypeScript estándar.
En nuestros despliegues, el framework cubre aproximadamente el 90% de las pantallas empresariales. El 10% restante usa código personalizado donde su complejidad se justifica. Incluso esos componentes personalizados heredan los patrones del framework para acceso a datos, permisos y manejo de errores.
La ventaja acumulativa
Cada nuevo descriptor hace al sistema más inteligente. La IA aprende de los descriptors existentes para redactar mejores. La biblioteca de componentes absorbe los casos límite a medida que aparecen. Los patrones resueltos una vez quedan disponibles para cada pantalla futura.
Con el tiempo, el sistema converge hacia un estado donde generar una nueva pantalla empresarial toma segundos y la salida está lista para producción de inmediato. No porque el modelo se hizo más inteligente. Porque hicimos el problema más pequeño.