Servidor MCP de RxJS

README en japonés disponible aquí

npm version npm downloads license Node.js

Release Provenance Trusted Publisher

TypeScript RxJS MCP PRs welcome

⚠️ Este es un proyecto comunitario no oficial, no afiliado al equipo de RxJS.

Ejecuta, depura y visualiza flujos de RxJS directamente desde asistentes de IA como Claude.

Características

🚀 Ejecución de flujos

Ejecuta código RxJS y captura emisiones
Visualización de línea de tiempo con marcas de tiempo
Seguimiento del uso de memoria
Soporte para todos los operadores principales de RxJS

📊 Diagramas de canicas (Marble Diagrams)

Genera diagramas de canicas en ASCII
Visualiza el comportamiento del flujo a lo largo del tiempo
Detección automática de patrones
Leyenda y explicaciones claras

🔍 Análisis de operadores

Analiza cadenas de operadores para evaluar el rendimiento
Detecta posibles problemas y cuellos de botella
Sugiere enfoques alternativos
Clasifica los operadores por función

🛡️ Detección de fugas de memoria

Identifica suscripciones no canceladas
Detecta patrones de limpieza faltantes
Recomendaciones específicas para frameworks (Angular, React, Vue)
Proporciona ejemplos de limpieza adecuada

💡 Sugerencias de patrones

Obtén patrones de RxJS probados en producción
Implementaciones específicas para frameworks
Casos de uso comunes cubiertos:
- Reintento HTTP con retroceso (backoff)
- Búsqueda tipo "typeahead"
- Reconexión de WebSocket
- Validación de formularios
- Gestión de estado
- ¡Y más!

Instalación

# Install globally
npm install -g @shuji-bonji/rxjs-mcp

# Or use with npx
npx @shuji-bonji/rxjs-mcp

Configuración

Claude Desktop

Añade a ~/Library/Application Support/Claude/claude_desktop_config.json:

{
  "mcpServers": {
    "rxjs": {
      "command": "npx",
      "args": ["@shuji-bonji/rxjs-mcp"]
    }
  }
}

VS Code con Continue/Copilot

Añade a .vscode/mcp.json:

{
  "mcpServers": {
    "rxjs": {
      "command": "npx",
      "args": ["@shuji-bonji/rxjs-mcp"]
    }
  }
}

Cursor

Añade a ~/.cursor/mcp.json:

{
  "mcpServers": {
    "rxjs": {
      "command": "npx",
      "args": ["@shuji-bonji/rxjs-mcp"]
    }
  }
}

Herramientas disponibles

execute_stream

Ejecuta código RxJS y captura las emisiones del flujo con una línea de tiempo.

La herramienta acepta una expresión que se evalúa como un Observable, o un fragmento de código que termine en dicha expresión; return es opcional.

// ✅ Trailing expression (v0.2.0+): the last expression is returned implicitly
interval(100).pipe(
  take(5),
  map((x) => x * 2),
);

// ✅ Declaration + trailing reference
const stream$ = interval(100).pipe(
  take(5),
  map((x) => x * 2),
);
stream$;

// ✅ Explicit return (always works)
return interval(100).pipe(
  take(5),
  map((x) => x * 2),
);

generate_marble

Genera diagramas de canicas en ASCII a partir de datos de eventos.

// Input: array of timed events
[
  { time: 0, value: 'A' },
  { time: 50, value: 'B' },
  { time: 100, value: 'C' },
];

// Output: A----B----C--|

analyze_operators

Analiza cadenas de operadores de RxJS para evaluar el rendimiento y las mejores prácticas.

// Analyzes chains like:
source$.pipe(
  map((x) => x * 2),
  filter((x) => x > 10),
  switchMap((x) => fetchData(x)),
  retry(3),
);

detect_memory_leak

Detecta posibles fugas de memoria y falta de limpieza.

// Detects issues like:
- Missing unsubscribe
- No takeUntil operator
- Uncompleted Subjects
- Infinite intervals

suggest_pattern

Obtén patrones listos para producción para casos de uso comunes.

Patrones disponibles:

http-retry - HTTP resiliente con reintento
search-typeahead - Búsqueda con debounce
polling - Sondeo inteligente con retroceso
websocket-reconnect - WebSocket con reconexión automática
form-validation - Validación reactiva de formularios
state-management - Almacén de estado simple
cache-refresh - Caché con estrategia de actualización
¡Y más!

Ejemplos de uso

Con Claude

User: "Execute this RxJS stream and show me the output"

Claude: I'll execute that RxJS stream for you.

[Uses execute_stream tool]

## Stream Execution Result
✅ Completed
Execution Time: 523ms
Values Emitted: 5

### Emitted Values
[0, 2, 4, 6, 8]

Depuración de fugas de memoria

User: "Check this Angular component for memory leaks"

Claude: I'll analyze your component for potential memory leaks.

[Uses detect_memory_leak tool]

## Memory Leak Analysis
⚠️ Potential leaks detected

1. 🔴 subscription (high severity)
   - Found 3 subscribe() calls but only 1 unsubscribe()
   - Fix: Use takeUntil pattern with destroy$ subject

Obtención de patrones

User: "Show me how to implement search with RxJS"

Claude: I'll show you the search typeahead pattern.

[Uses suggest_pattern tool with useCase: 'search-typeahead']

## Search Typeahead with Debounce
[Full implementation with explanation]

Seguridad

La herramienta execute_stream ejecuta el código proporcionado por el usuario en un Worker thread aislado para evitar:

Contaminación del proceso principal
Fugas de recursos por bucles infinitos o temporizadores
Acceso a APIs sensibles de Node.js (process, fs, etc.)

La ejecución se termina forzosamente si excede el tiempo de espera configurado.

Desarrollo

# Clone the repository
git clone https://github.com/shuji-bonji/rxjs-mcp-server
cd rxjs-mcp-server

# Install dependencies
npm install

# Build
npm run build

# Run tests
npm test              # Unit tests (vitest)
npm run test:mcp      # MCP integration test
npm run test:inspector # MCP Inspector (GUI)

# Run in development
npm run dev

Lanzamiento

Los lanzamientos están automatizados mediante GitHub Actions y se publican en npm utilizando Trusted Publisher (OIDC); no se utilizan tokens estáticos y cada lanzamiento lleva una atestación de procedencia de npm. Consulta RELEASING.md para ver el flujo de trabajo completo (y la configuración inicial de npm).

Integración con otros servidores MCP

El servidor MCP de RxJS funciona muy bien junto con:

Angular MCP - Para la creación de proyectos Angular
TypeScript MCP - Para la comprobación de tipos
ESLint MCP - Para la calidad del código

La futura integración Meta-MCP permitirá una coordinación fluida entre estas herramientas.

Arquitectura

┌─────────────────┐
│   AI Assistant  │
│   (Claude, etc) │
└────────┬────────┘
         │
    MCP Protocol
         │
┌────────┴────────┐
│  RxJS MCP Server│
├─────────────────┤
│ • execute_stream│
│ • generate_marble│
│ • analyze_operators│
│ • detect_memory_leak│
│ • suggest_pattern│
└─────────────────┘

Contribución

¡Las contribuciones son bienvenidas! Por favor, siéntete libre de enviar un PR.

rxjs-mcp-server