GraphMyCode — Visualiza y entiende tu código como un grafo
GraphMyCode convierte cualquier repositorio en un grafo interactivo de dependencias 3D.
Analiza imports, exportaciones, clases y funciones directamente en el navegador,
sin instalación, sin servidores y sin subir tu código a ningún servicio externo.
¿Qué es GraphMyCode?
GraphMyCode es una herramienta web de visualización estática de código que genera grafos
navegables de las relaciones entre archivos, módulos, clases y funciones de cualquier
repositorio. El análisis se ejecuta íntegramente en el navegador usando WebAssembly
(tree-sitter) para el parsing y modelos de embeddings locales (HuggingFace Transformers)
para la agrupación semántica. No requiere registro ni configuración.
Modos de visualización
- Grafo estructural: muestra todos los imports y exports entre archivos, clases y funciones con layout ForceAtlas2.
- Agrupación semántica 3D: agrupa código por similitud funcional usando embeddings locales y UMAP, incluso sin dependencias directas.
- Technical Debt City: representa cada archivo como un edificio 3D cuya altura indica su complejidad y acoplamiento.
- Heatmap de dependencias: colorea los nodos según el número de imports entrantes para detectar acoplamiento excesivo y dependencias circulares.
- Code Flow: genera un flowchart interactivo del flujo de ejecución de cualquier archivo, exportable como SVG.
- Architectural Layer: detecta automáticamente las capas del proyecto (api, service, data, ui, utility, config, test) en carriles paralelos. Las dependencias inversas aparecen en naranja para detectar violaciones arquitectónicas al instante.
Export Project Context — Contexto para agentes de IA
El botón "⬇ Export Project Context" genera un fichero project-context.md
que resume el grafo del proyecto: nodos más conectados, estructura de carpetas, dependencias
externas y grupos de código. Está diseñado para pegarse en un CLAUDE.md o
como system prompt de cualquier agente de IA.
En un proyecto de ~90 archivos, reduce el contexto necesario para Claude Code de
~100.000 tokens a ~2.000 tokens. El agente llega al problema real
más rápido y con menos alucinaciones sobre la estructura del proyecto.
Privacidad y procesamiento local
Tu código nunca sale de tu navegador. GraphMyCode usa WebAssembly y Web Workers para
ejecutar todo el análisis localmente. El único dato que viaja a servidores externos es
el contexto relevante cuando activas el chat IA con un proveedor externo (OpenAI, Gemini,
Anthropic u Ollama), y solo el fragmento de código relevante para tu pregunta.
Lenguajes soportados
TypeScript, JavaScript, Python, Go, Rust, Java, PHP, C, C++, C#, Swift, Kotlin, Ruby.
Casos de uso principales
- Onboarding en proyectos nuevos: entiende la arquitectura en minutos en lugar de días.
- Análisis de repositorios GitHub: analiza cualquier repo público sin clonarlo.
- Detección de acoplamiento excesivo y dependencias circulares.
- Planificación de refactorizaciones con análisis de impacto visual.
- Code reviews con visión global de la arquitectura del PR.
- Generación de contexto comprimido para Claude Code, Cursor y Copilot.
- Consultas Cypher (Neo4j) sobre la arquitectura del proyecto.
Tecnología
Construido con React 19, Vite, Tailwind CSS, Three.js, Sigma.js y Graphology.
El análisis usa tree-sitter WASM para el parsing AST, HuggingFace Transformers.js
para embeddings locales, y LangChain para la integración multi-proveedor de IA.
Creado por Francisco Valero ·
Licencia PolyForm Noncommercial 1.0.0 (gratuito para uso no comercial)