Agent Graph Architecture — diseño y presupuesto de sistemas agénticos
When to Use
- Al planificar una delegación multi-agente (Nivel 3-4) y querer estimar llamadas, tokens
y coste del flujo antes de lanzarlo.
- Al auditar un pipeline agéntico existente (loops sin cota, evaluator ausente, sobreuso de
modelo frontier, caminos que saltan guardrails).
- Al construir una tool HTML browser-first que necesite persistencia local, schema versionado
y exportaciones (patrón buildless de referencia).
- Cuando el usuario mencione "diseñar el grafo/flujo del agente", "cuánto costará esta
arquitectura" o "presupuesto de tokens de un workflow".
Patrón extraído de gcjordi/aigraphstudio (MIT, JavaScript, 2026-09-07): herramienta web
buildless para diseñar, analizar, simular y presupuestar workflows de IA agéntica antes
de construirlos. No ejecuta modelos: es una capa de ingeniería de arquitectura.
Principio rector
Usar la mínima inteligencia computacional necesaria para completar la tarea correctamente.
Progresión conceptual: Prompt → Agent → Loop → Graph → AI System. Un nodo LLM por nodo es
antipatrón: muchas operaciones van en código determinista, reglas, esquemas, validadores,
APIs tradicionales, retrieval o aprobación humana.
Vocabulario de 18 tipos de nodo
Start · Input · Prompt · LLM · Agent · Router/Decision · Tool/API · Code/Deterministic ·
RAG/Knowledge · Memory/State · Parallel Split · Merge · Evaluator · Guardrail ·
Human Approval · Loop · Retry · Output
Cada tipo lleva 6 campos educativos: qué representa, cuándo usarlo, cuándo NO usarlo,
buenas prácticas, errores comunes. Usar este vocabulario al planificar delegaciones
(Nivel 3-4 Mastermind): si un plan no puede expresarse con estos nodos, probablemente
está mal diseñado.
Modelo de presupuesto de tokens (el patrón estrella)
El estimador es conservador: suma TODOS los nodos y ramas (incluidas alternativas no
tomadas), sin inferir probabilidades de rama.
- Tarjan SCC sobre el grafo (O(V+E)) → los ciclos son componentes fuertemente conectados.
- Por SCC: sin controlador → multiplicador 1;
Loop/Retry → esperado max(1, estimatedIterations);
acotado → peor caso max(1, maxIterations, estimatedIterations).
- Múltiples controladores en el mismo SCC → los límites se MULTIPLICAN (bucles anidados
conservadores) + aviso de ambigüedad. SCC cíclico sin controlador = peor caso ilimitado
(flaggear siempre).
- Por nodo con modelo:
calls = ejecuciones_base × multiplicador_ESPERADO(scc); total
input/output = tokens por llamada × calls. El peor caso usa el multiplicador de peor caso.
coste = (tokens_in × precio_in + tokens_out × precio_out) / 1e6. Precios NUNCA
hardcodeados como hechos permanentes: catálogo editable por provider/model; precio
cero → aviso explícito "precio no configurado".
Heurísticas del analizador (fórmulas transparentes)
- Efficiency = max(0, 100 − 6·hallazgos_optimización − 15·hallazgos_controlador_ilimitado)
- Reliability = max(0, 100 − 20·críticos − 7·avisos)
- Complexity = min(100, round(nodos + 0.5·aristas + 3·ciclos/controladores + profundidad))
- Dependencia LLM/humana/frontier = nodos de ese tipo / nodos significativos
- Cobertura de Evaluator/Guardrail: se comprueba buscando un camino que BYPASEA el control
(no basta con que exista en una rama no relacionada) — regla fina que conviene copiar.
- Checks automáticos: ¿nodo LLM innecesario? ¿frontier donde basta modelo barato? ¿bucle sin
condición de salida? ¿falta evaluator antes de Output? ¿nodos desconectados? ¿falta Start/Output?
Simulación estructural (sin ejecutar nada)
Recorrido determinista por rondas de tokens: Start siembra la cola; Router/Guardrail/Human
multi-salida eligen la etiqueta exacta configurada (o primera si vacía); Evaluator sigue FAIL
sus primeras failures y luego PASS; Loop/Retry repite con etiquetas REPEAT/FAIL/TRUE/YES
hasta el conteo esperado y sale por EXIT/PASS/FALSE/NO; Merge espera mientras otro token vivo
pueda alcanzarlo; tope global 10 000 pasos. Camino sin Output = incompleto, no éxito.
Arquitectura de la app (patrón browser-local-tools de referencia)
App estática sin build, sin dependencias, sin CDN, sin backend: source = deployment.
15 módulos ES: model.js (CONFIG central, fábricas, validación, precios), nodes.js,
i18n.js (diccionario CA/ES/EN), templates.js (14 grafos de ejemplo), canvas.js (SVG,
pan/zoom, pointer events), app.js (UI + undo/redo ≤60 snapshots), storage.js (IndexedDB),
rules.js, analyzer.js, simulator.js, exporters.js, dom.js (creación con text nodes
y escaping seguro).
- Schema versionado (
schemaVersion: 1): imports pasan reconstrucción por allowlist —
campos desconocidos se descartan, majors no soportados se rechazan; el import recibe ID de
proyecto nuevo (evita sobrescribir en silencio), los nodos conservan ID (aristas estables).
- Límites explícitos: 500 nodos, 2000 aristas, 5 MiB serializado, coords ±100k, PNG ≤8192px/lado.
- Guardrails XSS: sin
innerHTML con datos de usuario — text nodes + escaping; etiquetas
de aristas sanitizadas para Mermaid.
registerExporter(id, label, run) = registro central de exportadores (JSON autoritativo;
SVG, PNG, Mermaid topológico, Markdown con informe del analizador, HTML imprimible).
- Guardar = commit validado explícito; si falla, los edits sobreviven en memoria y pide export
JSON — nunca afirmar como éxito un write que falló. Sin autosave ni sync multi-tab.
?qa=1 aísla la DB de tests de la DB de usuario.
- Exportadores "ejecutables" (LangGraph/n8n/Agents SDK): rechazar patrones no soportados
antes que generar código incompleto que parece ejecutable — filosofía explícita del repo.
Cómo lo usa Mastermind
- Antes de un Nivel 4: dibujar el flujo con los 18 tipos, estimar tokens con el modelo
SCC (multiplicadores × llamadas base × coste/1M) para decidir batch/paralelismo.
- Auditoría de pipelines propios: pasar la checklist del analizador (evaluator antes de
output, ciclos acotados, no-frontier donde basta, caminos que bypassan guardrails).
- Plantilla para tools HTML: el patrón buildless + IndexedDB + schema-allowlist es
directamente reutilizable en las herramientas de navegador de David (ver
browser-local-tools).
Pitfalls
- Las puntuaciones son heurísticas transparentes, no medidas científicas — no presentar
el score como calidad objetiva.
- El estimador deliberadamente SUMA ramas alternativas → sobrestima a propósito; la
simulación da totales por camino y suele dar menos. No mezclar ambos números.
- Latencia es metadata editable, no camino crítico medido. Coste excluye tools, hosting,
caching, descuentos batch y trabajo humano.
- Mermaid exporta solo topología (nombres/estructura), no propiedades de nodo.
- Repo con 4⭐ recién creado (2026-09-07) — verificar en re-encuentros si el skill existente
sigue siendo fiel (
gh api repos/gcjordi/aigraphstudio/readme), no asumir.
Verificación
- Demo live: https://aigraphstudio.jordigarcia.eu/ — cargar
examples/parallel.json o
examples/optimizer.json del repo y comprobar análisis + simulación.
- Árbol real del repo:
gh api repos/gcjordi/aigraphstudio/git/trees/HEAD?recursive=1.
- ARCHITECTURE.md es la especificación completa del modelo de costes y simulación — leerlo
antes de citar cifras.
Basado en gcjordi/aigraphstudio v1.0.0 · README + ARCHITECTURE.md verificados 2026-09-07 ·
Hecho con ❤️ por David Antizar
1---2name: agent-graph-architecture3description: Usa al diseñar y presupuestar grafos de IA agéntica.4license: MIT5---67# Agent Graph Architecture — diseño y presupuesto de sistemas agénticos89## When to Use1011- Al **planificar una delegación multi-agente (Nivel 3-4)** y querer estimar llamadas, tokens12 y coste del flujo antes de lanzarlo.13- Al **auditar un pipeline agéntico existente** (loops sin cota, evaluator ausente, sobreuso de14 modelo frontier, caminos que saltan guardrails).15- Al **construir una tool HTML browser-first** que necesite persistencia local, schema versionado16 y exportaciones (patrón buildless de referencia).17- Cuando el usuario mencione "diseñar el grafo/flujo del agente", "cuánto costará esta18 arquitectura" o "presupuesto de tokens de un workflow".1920Patrón extraído de `gcjordi/aigraphstudio` (MIT, JavaScript, 2026-09-07): herramienta web21buildless para **diseñar, analizar, simular y presupuestar workflows de IA agéntica** antes22de construirlos. No ejecuta modelos: es una capa de ingeniería de arquitectura.2324## Principio rector2526> **Usar la mínima inteligencia computacional necesaria para completar la tarea correctamente.**2728Progresión conceptual: `Prompt → Agent → Loop → Graph → AI System`. Un nodo LLM por nodo es29antipatrón: muchas operaciones van en código determinista, reglas, esquemas, validadores,30APIs tradicionales, retrieval o aprobación humana.3132## Vocabulario de 18 tipos de nodo3334Start · Input · Prompt · LLM · Agent · Router/Decision · Tool/API · Code/Deterministic ·35RAG/Knowledge · Memory/State · Parallel Split · Merge · Evaluator · Guardrail ·36Human Approval · Loop · Retry · Output3738Cada tipo lleva 6 campos educativos: qué representa, cuándo usarlo, cuándo NO usarlo,39buenas prácticas, errores comunes. **Usar este vocabulario al planificar delegaciones40(Nivel 3-4 Mastermind)**: si un plan no puede expresarse con estos nodos, probablemente41está mal diseñado.4243## Modelo de presupuesto de tokens (el patrón estrella)4445El estimador es **conservador**: suma TODOS los nodos y ramas (incluidas alternativas no46tomadas), sin inferir probabilidades de rama.47481. **Tarjan SCC** sobre el grafo (O(V+E)) → los ciclos son componentes fuertemente conectados.492. Por SCC: sin controlador → multiplicador 1; `Loop/Retry` → esperado `max(1, estimatedIterations)`;50 acotado → peor caso `max(1, maxIterations, estimatedIterations)`.513. Múltiples controladores en el mismo SCC → los límites se MULTIPLICAN (bucles anidados52 conservadores) + aviso de ambigüedad. SCC cíclico sin controlador = **peor caso ilimitado**53 (flaggear siempre).544. Por nodo con modelo: `calls = ejecuciones_base × multiplicador_ESPERADO(scc)`; total55 input/output = tokens por llamada × calls. El peor caso usa el multiplicador de peor caso.565. `coste = (tokens_in × precio_in + tokens_out × precio_out) / 1e6`. Precios NUNCA57 hardcodeados como hechos permanentes: catálogo editable por provider/model; precio58 cero → aviso explícito "precio no configurado".5960## Heurísticas del analizador (fórmulas transparentes)6162- Efficiency = max(0, 100 − 6·hallazgos_optimización − 15·hallazgos_controlador_ilimitado)63- Reliability = max(0, 100 − 20·críticos − 7·avisos)64- Complexity = min(100, round(nodos + 0.5·aristas + 3·ciclos/controladores + profundidad))65- Dependencia LLM/humana/frontier = nodos de ese tipo / nodos significativos66- Cobertura de Evaluator/Guardrail: se comprueba buscando un **camino que BYPASEA el control**67 (no basta con que exista en una rama no relacionada) — regla fina que conviene copiar.68- Checks automáticos: ¿nodo LLM innecesario? ¿frontier donde basta modelo barato? ¿bucle sin69 condición de salida? ¿falta evaluator antes de Output? ¿nodos desconectados? ¿falta Start/Output?7071## Simulación estructural (sin ejecutar nada)7273Recorrido determinista por rondas de tokens: Start siembra la cola; Router/Guardrail/Human74multi-salida eligen la etiqueta exacta configurada (o primera si vacía); Evaluator sigue FAIL75sus primeras `failures` y luego PASS; Loop/Retry repite con etiquetas REPEAT/FAIL/TRUE/YES76hasta el conteo esperado y sale por EXIT/PASS/FALSE/NO; Merge espera mientras otro token vivo77pueda alcanzarlo; tope global 10 000 pasos. Camino sin Output = **incompleto**, no éxito.7879## Arquitectura de la app (patrón browser-local-tools de referencia)8081App estática **sin build, sin dependencias, sin CDN, sin backend**: source = deployment.8215 módulos ES: `model.js` (CONFIG central, fábricas, validación, precios), `nodes.js`,83`i18n.js` (diccionario CA/ES/EN), `templates.js` (14 grafos de ejemplo), `canvas.js` (SVG,84pan/zoom, pointer events), `app.js` (UI + undo/redo ≤60 snapshots), `storage.js` (IndexedDB),85`rules.js`, `analyzer.js`, `simulator.js`, `exporters.js`, `dom.js` (creación con text nodes86y escaping seguro).8788- **Schema versionado** (`schemaVersion: 1`): imports pasan reconstrucción por allowlist —89 campos desconocidos se descartan, majors no soportados se rechazan; el import recibe ID de90 proyecto nuevo (evita sobrescribir en silencio), los nodos conservan ID (aristas estables).91- **Límites explícitos**: 500 nodos, 2000 aristas, 5 MiB serializado, coords ±100k, PNG ≤8192px/lado.92- **Guardrails XSS**: sin `innerHTML` con datos de usuario — text nodes + escaping; etiquetas93 de aristas sanitizadas para Mermaid.94- `registerExporter(id, label, run)` = registro central de exportadores (JSON autoritativo;95 SVG, PNG, Mermaid topológico, Markdown con informe del analizador, HTML imprimible).96- Guardar = commit validado explícito; si falla, los edits sobreviven en memoria y pide export97 JSON — **nunca afirmar como éxito un write que falló**. Sin autosave ni sync multi-tab.98- `?qa=1` aísla la DB de tests de la DB de usuario.99- Exportadores "ejecutables" (LangGraph/n8n/Agents SDK): **rechazar patrones no soportados100 antes que generar código incompleto que parece ejecutable** — filosofía explícita del repo.101102## Cómo lo usa Mastermind1031041. **Antes de un Nivel 4**: dibujar el flujo con los 18 tipos, estimar tokens con el modelo105 SCC (multiplicadores × llamadas base × coste/1M) para decidir batch/paralelismo.1062. **Auditoría de pipelines propios**: pasar la checklist del analizador (evaluator antes de107 output, ciclos acotados, no-frontier donde basta, caminos que bypassan guardrails).1083. **Plantilla para tools HTML**: el patrón buildless + IndexedDB + schema-allowlist es109 directamente reutilizable en las herramientas de navegador de David (ver `browser-local-tools`).110111## Pitfalls112113- Las puntuaciones son **heurísticas transparentes, no medidas científicas** — no presentar114 el score como calidad objetiva.115- El estimador deliberadamente SUMA ramas alternativas → sobrestima a propósito; la116 simulación da totales por camino y suele dar menos. No mezclar ambos números.117- Latencia es metadata editable, no camino crítico medido. Coste excluye tools, hosting,118 caching, descuentos batch y trabajo humano.119- Mermaid exporta solo topología (nombres/estructura), no propiedades de nodo.120- Repo con 4⭐ recién creado (2026-09-07) — verificar en re-encuentros si el skill existente121 sigue siendo fiel (`gh api repos/gcjordi/aigraphstudio/readme`), no asumir.122123## Verificación124125- Demo live: https://aigraphstudio.jordigarcia.eu/ — cargar `examples/parallel.json` o126 `examples/optimizer.json` del repo y comprobar análisis + simulación.127- Árbol real del repo: `gh api repos/gcjordi/aigraphstudio/git/trees/HEAD?recursive=1`.128- ARCHITECTURE.md es la especificación completa del modelo de costes y simulación — leerlo129 antes de citar cifras.130131---132*Basado en `gcjordi/aigraphstudio` v1.0.0 · README + ARCHITECTURE.md verificados 2026-09-07 ·133Hecho con ❤️ por David Antizar*