VP LAB · AI SYSTEMS

El código
después del diseño.

Agentes de IA, automatizaciones y sistemas inteligentes — construidos sobre años aplicando Design Thinking.

OPEN SOURCE · PATRÓN

Frugal Context

File Architecture for AI

Un patrón de arquitectura de archivos para desarrollo asistido por IA. Estructura tu codebase para que cada sesión solo lea lo que necesita.

GitHub

Brief

Cuando trabajas con Claude Code o cualquier asistente de IA, los archivos monolíticos grandes se leen completos en cada sesión — aunque solo necesites tocar una pequeña parte.

Esto consume tokens innecesariamente y hace las sesiones más lentas y caras. La idea no es nueva en software (SRP, separation of concerns), pero aplicada al coste de tokens en AI-assisted dev tiene consecuencias concretas de arquitectura.

Frugal Context es un set de 5 reglas estructurales que aseguran que cada sesión de trabajo solo requiera leer los archivos estrictamente necesarios para la tarea en curso.

Ejemplo real

vasylpavlyuchok.com sección /ai. Antes: un único archivo de 1.217 líneas que contenía datos, componentes UI y animaciones mezclados. Cada vez que se tocaba cualquier cosa en /ai — añadir una entrada, ajustar un color, modificar un snippet — se leían las 1.217 líneas completas.

Después del split: 4 archivos por responsabilidad. Cada sesión lee solo lo que necesita.

vasylpavlyuchok.com /ai — caso real
Antes1,217 líneas
_shared.tsx

monolito leído entero

Después1,268 líneas · 4 archivos
_data.ts
233L

datos puros + traducciones

_components.tsx
567L

componentes UI (cards, legends)

_rain.tsx
458L

engine de animación + snippets

_shared.tsx
10L

barrel de re-exports

lee solo lo que necesita

Qué leer para qué tarea

Cada tarea solo lee los archivos relevantes. La ganancia es proporcional al monolito que evitas.

Selecciona una tarea →
src/app/ai/
_data.tsdatos puros + traduccionesleído
_components.tsxcomponentes UI (cards, legends)
_rain.tsxengine de animación + snippets
_shared.tsxbarrel de re-exports
ahorro84%vs. leer el monolito
Líneas leídas por sesiónAñadir entrada al AI Lab
Sin Frugal Context1,217 L
Con Frugal Context233 L
líneas evitadas984 (84%)

Las 5 reglas

Ninguna requiere herramientas. Ningún CLI. Es un patrón — un set de decisiones de arquitectura.

01Separa datos de UI

Datos puros (arrays, traducciones, tipos) en archivos .ts sin React. Son los más modificados y los más rápidos de leer. Mover datos a su propio archivo libera el componente de líneas de payload.

02Separa UI por dominio funcional

Componentes de naturaleza distinta no van juntos. Cards, animaciones de fondo, overlays y datos cambian en momentos diferentes — deben vivir en archivos diferentes.

03Barrel lean para backward compat

El archivo original se convierte en barrel de re-exports. Ningún import existente se rompe. Quien quiera máxima frugalidad puede importar directamente desde el sub-archivo.

04Elimina código muerto

Un archivo no importado en ningún lugar consume tokens si aparece en el contexto del proyecto. Eliminarlo es parte del sistema, no una limpieza opcional.

05Límite por archivo: 150 líneas

Más de 150 líneas: candidato a split. Más de 300: split obligatorio. La métrica no es estética — es coste por sesión.

Complementa ARC

Frugal Context y ARC resuelven dos caras del mismo problema.

ARC gestiona qué reglas de comportamiento aplicar según el contexto. Frugal Context gestiona qué archivos leer. Ambos atacan el coste de tokens en cada sesión — uno desde el lado de las reglas, el otro desde el lado del código.

Funcionan independientes pero se complementan: con ARC + Frugal Context aplicados, una sesión típica lee ~70% menos que sin ninguno.

Ver ARC →

Resultado

~70%

menos tokens en sesiones enfocadas

El número viene de un caso real — la sección /ai de vasylpavlyuchok.com pasó de leer 1.217 líneas por sesión a 200–350 según la tarea. Pero el verdadero beneficio no son los tokens: es la velocidad. Sesiones más cortas, menos compactaciones, más atención al task. Cuando Claude no tiene que procesar 80% de payload irrelevante, sus respuestas son visiblemente más precisas.

Aplícalo en tu proyecto

Pásale el link del repo a tu Claude Code. Las 5 reglas son cortas y el ejemplo real está incluido.

Ver en GitHub →