rxjs-mcp-server

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

GitHub
4
Prueba este MCPPatrocinado

Documentación

Servidor MCP de RxJS

Versión en japonés del README

npm version npm downloads license Node.js

CI 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 las 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 mármol

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

🔍 Análisis de operadores

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

🛡️ Detección de fugas de memoria

  • Identifica suscripciones no canceladas
  • Detecta patrones de limpieza faltantes
  • Recomendaciones específicas por framework (Angular, React, Vue)
  • Proporciona ejemplos de limpieza adecuados

💡 Sugerencias de patrones

  • Obtén patrones de RxJS probados en producción
  • Implementaciones específicas por framework
  • Casos de uso comunes cubiertos:
    • Reintento HTTP con retroceso exponencial
    • Búsqueda con autocompletado
    • Reconexión de WebSocket
    • Validación de formularios
    • Gestión de estado
    • Y más...

Instalación

Requisitos

  • Node.js >= 22 (engines.node). El SDK de TypeScript de MCP v2 sobre el que se construye este servidor requiere Node.js >= 20; este paquete establece un mínimo más alto para mantenerse en una línea LTS con soporte.
# 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 línea de tiempo.

La herramienta acepta una expresión que evalúa a un Observable, o un fragmento que termina 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 mármol 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 rendimiento y 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 limpieza faltante.

// 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 reintentos
  • search-typeahead - Búsqueda con debounce
  • polling - Sondeo inteligente con retroceso
  • websocket-reconnect - WebSocket con reconexión automática
  • form-validation - Validación de formularios reactiva
  • state-management - Almacén de estado simple
  • cache-refresh - Caché con estrategia de actualización
  • Y más...

lint_rxjs

Analiza fragmentos de código RxJS para detectar problemas comunes y mejores prácticas. Basado en las reglas de eslint-plugin-rxjs-x.

// Parameters:
{
  code: string;           // RxJS code to lint
  config?: 'recommended' | 'strict';  // Rule set (default: recommended)
  framework?: 'angular' | 'react' | 'vue' | 'none'; // Framework context
  rules?: string[];       // Specific rules to check (overrides config)
}

Niveles de configuración:

  • recommended — 20 reglas que cubren los problemas más comunes
  • strict — las 28 reglas de eslint-plugin-rxjs-x en strict (no-exposed-subjects, no-misused-observables, no-unnecessary-collection, etc.)

finnish no está en ninguna de las dos configuraciones, coincidiendo con el plugin, y solo se ejecuta cuando se nombra explícitamente: rules: ["finnish"]. Las comprobaciones específicas por framework se añaden además de ambos niveles.

Comprobaciones específicas por framework:

  • Angular — Detecta la falta de takeUntilDestroyed() o takeUntil(destroy$) en componentes
  • React — Detecta subscribe() sin limpieza de useEffect
  • Vue — Detecta subscribe() sin limpieza de onUnmounted

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 código proporcionado por el usuario en un hilo Worker 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 supera 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

Publicación de versiones

Las versiones se automatizan mediante GitHub Actions y se publican en npm usando Trusted Publisher (OIDC) — no se utilizan tokens estáticos, y cada versión incluye 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 el andamiaje de proyectos Angular
  • TypeScript MCP - Para la comprobación de tipos
  • ESLint MCP - Para la calidad del código

La futura integración con 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│
│ • lint_rxjs      │
└─────────────────┘

El servidor está construido sobre el SDK de TypeScript de MCP v2 (@modelcontextprotocol/server@^2.0.0, revisión de protocolo 2026-07-28). Solo habla stdio: src/index.ts entrega la fábrica createServer() en src/server.ts a serveStdio(), que también atiende a clientes que aún usan las revisiones de protocolo de 2025.

Sistema de referencia de documentación

Desde la v0.3.0, analyze_operators genera enlaces de documentación en tres niveles para cada operador y función de creación:

NivelFuentePropósito¿Legible por IA?
Oficialrxjs.devReferencia de API autoritativa para humanos❌ (SPA)
Código fuenteGitHub (etiqueta 7.8.2)JSDoc + implementación — el contexto más rico para IA✅
GuíaRxJS-with-TypeScriptExplicaciones bilingües JP/EN con ejemplos prácticos✅

¿Por qué incluir la guía comunitaria junto a la documentación oficial?

  1. rxjs.dev es una SPA renderizada en el cliente. Los asistentes de IA no pueden obtener su contenido — las peticiones HTTP devuelven una carcasa vacía con cargadores de JavaScript. Por tanto, el sitio oficial es un "enlace para entregar a humanos", no una fuente que la IA pueda leer.

  2. El código fuente de GitHub proporciona la verdad cruda. El código fuente de RxJS (fijado en la etiqueta 7.8.2) contiene JSDoc, firmas de tipos y detalles de implementación. Esta es la referencia principal para los asistentes de IA.

  3. La guía bilingüe añade contexto de aprendizaje. Organiza los operadores por caso de uso (no solo alfabéticamente), proporciona ejemplos ejecutables y ofrece traducciones al japonés. Para usuarios o estudiantes de habla japonesa, esto cubre un vacío que ni rxjs.dev ni el código fuente abordan.

Orden de prioridad

Cuando el servidor MCP genera referencias, sigue esta prioridad:

  1. officialUrl — siempre se muestra (autoridad, legible por humanos)
  2. sourceUrl — se muestra cuando está disponible (la IA debería leer esto)
  3. guideUrl — se muestra cuando la página existe (complementario)

Si una página de la guía aún no existe para un operador, el campo simplemente se omite (sin enlaces rotos). La cobertura se supervisa mediante el CI de validación de URL.

¿Puedo desactivar las referencias a la guía?

Actualmente no hay una opción en tiempo de ejecución para excluir guideUrl de la salida. Si prefieres solo referencias oficiales, puedes bifurcar este servidor o abrir una solicitud de funcionalidad. Una versión futura podría admitir una marca --references=official,source.

Contribuciones

¡Las contribuciones son bienvenidas! No dudes en enviar un pull request.

Licencia

MIT

Autor

Shuji Bonji

Enlaces