Frond es una librería para React que reorganiza la arquitectura de las aplicaciones frontend en torno a un grafo de nodos explícitamente tipados, en el que cada nodo declara sus dependencias, cómo se inicializa y cómo se libera. La herramienta parte de la premisa de que toda aplicación React en crecimiento acaba improvisando un runtime disperso entre proveedores, efectos y scripts de limpieza, y propone modelar ese runtime como un grafo.
El componente central es el grafo de dependencias. Un nodo, como SessionNode o PresenceNode, se declara mediante un NodeSpec que incluye argumentos, clave de instanciación, dependencias y un driver (asíncrono o síncrono). El runtime se encarga de inicializar cada nodo solo cuando todas sus dependencias están listas y de liberar las hojas cuando un nodo raíz se desactiva. La función controls.evict("selfAndDependents", "sign-out") permite cerrar sesión y eliminar, interrumpir y liberar de una sola vez todos los nodos asociados al usuario actual, sin listas manuales.
El ciclo de vida constituye el núcleo del producto: cuando un nodo cambia de clave, los dependientes se invalidan; cuando se reemplaza el usuario autenticado, los nodos bajo su ámbito se desalojan y Effect interrumpe el trabajo en curso. Los nodos pueden ser además objetos observables MobX, de modo que el estado de dominio se integra con la reactividad existente.
Frond también incorpora propagación tipada extremo a extremo: cada dep lleva el tipo de su nodo, de forma que la forma del resultado se infiere a través de toda la cadena y los consumidores en React la reciben sin anotaciones explícitas. Cuando el backend está tipado (tRPC, gRPC, OpenAPI), los tipos atraviesan el grafo hasta el componente. Los errores circulan por el mismo grafo: cada fallo lleva clase, etiqueta, indicador de reintento y cadena causal, y el runtime los proyecta a un informe serializable que se enruta a un sumidero único, por ejemplo Sentry, con agrupación consciente del grafo.
La librería se posiciona frente a alternativas como Redux o Zustand (estado y selectores), React Query (caché de servidor), MobX (estado de dominio observable) y Context (propagación de valores). Frente a ellas, Frond aporta el contrato de ejecución que rodea a ese estado: dependencias, inicialización, liberación, tipado extremo a extremo y errores estructurados. Está dirigida a equipos que mantienen aplicaciones React grandes y buscan reemplazar las listas de tareas manuales de inicialización y limpieza por una estructura declarativa.