// 01 > CONTEXT
Ghostframes es una biblioteca de esqueletos de carga de React entregada como un único paquete público, @ghostframes/runtime. Captura manifiestos de esqueleto a partir de componentes reales en tiempo de build y hace cumplir su calidad en CI.
// 02 > THE_PROBLEM
Los esqueletos de carga se escriben a mano y divergen de los componentes que imitan, así que con el tiempo se degradan hacia la forma equivocada.
Mantener los esqueletos manualmente es tedioso y propenso a errores, y nada detecta cuándo un esqueleto deja de coincidir con su componente, así que los estados de carga se degradan en silencio.
Antes
Esqueletos escritos a mano · divergencia de los componentes · sin barrera de calidad
// 03 > APPROACH
Generé esqueletos a partir de componentes reales en tiempo de build y añadí barreras de CI que hacen cumplir el esquema, la cobertura de claves, un presupuesto de entradas inválidas y el tamaño de los artefactos.
Captura en tiempo de build
AutoSkeleton y generateStaticBlueprint producen artefactos de carga a partir del árbol de componentes real.
Barreras de calidad en CI
ghostframes validate, diff y report hacen cumplir el esquema, la cobertura y el tamaño en cada cambio.
// 04 > THE_RESULT
Los esqueletos se generan a partir de los componentes reales y se mantienen alineados por las barreras de CI, así que los estados de carga siguen siendo precisos sin mantenimiento manual.
Antes
- Esqueletos escritos a mano
- Divergencia de los componentes reales
- Sin comprobaciones automatizadas
Después
- Generados en tiempo de build
- Barreras de esquema + cobertura en CI
- Cero configuración en runtime
“Un esqueleto debería venir del componente, no de una segunda copia que mantienes a mano. Genéralo, y deja que CI lo mantenga honesto.”