# Multi-Agent-Systeme mit TypeScript: Architektur für skalierbare AI-Workflows

**Meta-Description:** Lernen Sie, wie Sie Multi-Agent-Systeme mit TypeScript orchestrieren. Vergleich von LangGraph, AutoGen und Mastra mit praktischen Code-Beispielen und Architektur-Patterns.

**Keywords:** Multi-Agent-Systeme, TypeScript AI, LangGraph, AutoGen, Agent Orchestration, AI Workflows, Mastra, Agent Framework

---

## Einführung

Die Ära der Single-Agent-Anwendungen neigt sich dem Ende. 2026 dominieren Multi-Agent-Systeme, in denen spezialisierte Agenten zusammenarbeiten – ein Researcher sammelt Informationen, ein Analyst verarbeitet sie, ein Writer erstellt den Report.

Aber wie orchestriert man diese Agenten effektiv? In diesem Artikel zeige ich Ihnen die führenden Frameworks, ihre Stärken und Schwächen, und gebe Ihnen praktische TypeScript-Implementierungen an die Hand.

---

## Die Framework-Landschaft 2026

### Die großen Veränderungen

Das Agentic-AI-Framework-Ökosystem hat sich 2025/2026 drastisch verändert:

1. **März 2025:** OpenAI Agents SDK ersetzt Swarm
2. **Oktober 2025:** Microsoft merged AutoGen mit Semantic Kernel
3. **2026:** LangGraph etabliert sich als Performance-Leader

Sieben große Frameworks konkurrieren nun um die Gunst der Entwickler.

---

## Framework-Vergleich

### LangGraph (by LangChain)

**Architektur:** Graph-basiert
**Stärke:** Performance & Token-Effizienz

LangGraph verwendet einen gerichteten Graphen, in dem jeder Agent als Knoten mit eigenem State fungiert:

```typescript
import { StateGraph, START, END } from "@langchain/langgraph";

// State-Definition
interface AgentState {
  messages: Message[];
  currentAgent: string;
  taskComplete: boolean;
}

// Graph erstellen
const workflow = new StateGraph<AgentState>({
  channels: {
    messages: { value: (a, b) => [...a, ...b] },
    currentAgent: { value: (_, b) => b },
    taskComplete: { value: (_, b) => b }
  }
});

// Agenten als Nodes hinzufügen
workflow.addNode("researcher", researcherAgent);
workflow.addNode("analyst", analystAgent);
workflow.addNode("writer", writerAgent);

// Routing-Logik
workflow.addConditionalEdges("researcher", (state) => {
  if (state.taskComplete) return END;
  return "analyst";
});

workflow.addEdge(START, "researcher");
workflow.addEdge("analyst", "writer");
workflow.addEdge("writer", END);

const app = workflow.compile();
```

**Warum LangGraph schneller ist:**
LangGraph übergibt nur State-Deltas zwischen Nodes, nicht vollständige Conversation-Histories. Das resultiert in minimalem Token-Verbrauch und reduzierter Latenz.

**Best for:** Komplexe Agent-Workflows mit fine-grained Orchestration

---

### AutoGen (Microsoft)

**Architektur:** Conversation-basiert (Group Chat)
**Stärke:** Kollaboratives Reasoning

AutoGen definiert Agenten als adaptive Einheiten, die über strukturierte natürliche Sprache kommunizieren – wie in einem Gruppenchat:

```typescript
import { AssistantAgent, UserProxyAgent, GroupChat } from "autogen";

// Spezialisierte Agenten erstellen
const researcher = new AssistantAgent({
  name: "Researcher",
  systemMessage: `Du bist ein Research-Spezialist.
    Deine Aufgabe: Sammle relevante Informationen aus Quellen.
    Antworte immer mit strukturierten Erkenntnissen.`,
  llmConfig: {
    model: "gpt-4",
    temperature: 0.7
  }
});

const analyst = new AssistantAgent({
  name: "Analyst",
  systemMessage: `Du bist ein Datenanalyst.
    Deine Aufgabe: Analysiere die Informationen des Researchers.
    Identifiziere Patterns und Insights.`
});

const writer = new AssistantAgent({
  name: "Writer",
  systemMessage: `Du bist ein technischer Writer.
    Deine Aufgabe: Erstelle aus den Analysen einen Report.`
});

// GroupChat für Kollaboration
const groupChat = new GroupChat({
  agents: [researcher, analyst, writer],
  messages: [],
  maxRound: 10,
  speakerSelectionMethod: "auto"
});

// Ausführen
const result = await groupChat.initiate({
  message: "Analysiere die aktuellen AI-Agent-Trends für 2026"
});
```

**Best for:** Forschung und Prototyping mit flexiblem Agent-Verhalten

---

### Mastra (TypeScript-Native)

**Architektur:** Workflow-basiert
**Stärke:** TypeScript-First, Type Safety

Mastra ist speziell für TypeScript entwickelt und bietet volle Type-Safety:

```typescript
import { Mastra, Agent, Workflow } from "@mastra/core";

// Mastra-Instanz
const mastra = new Mastra({
  llm: {
    provider: "anthropic",
    model: "claude-3-sonnet"
  }
});

// Agent mit Tools definieren
const researchAgent = mastra.createAgent({
  name: "researcher",
  instructions: "Du recherchierst Informationen zu Themen.",
  tools: {
    webSearch: {
      description: "Sucht im Web nach Informationen",
      parameters: z.object({
        query: z.string(),
        maxResults: z.number().default(5)
      }),
      execute: async ({ query, maxResults }) => {
        return await searchWeb(query, maxResults);
      }
    }
  }
});

// Workflow definieren
const researchWorkflow = mastra.createWorkflow({
  name: "research-pipeline",
  steps: [
    {
      id: "research",
      agent: researchAgent,
      input: (ctx) => ctx.initialQuery
    },
    {
      id: "analyze",
      agent: analystAgent,
      input: (ctx) => ctx.steps.research.output
    },
    {
      id: "write",
      agent: writerAgent,
      input: (ctx) => ({
        research: ctx.steps.research.output,
        analysis: ctx.steps.analyze.output
      })
    }
  ]
});

// Ausführen
const result = await researchWorkflow.execute({
  initialQuery: "AI Agent Trends 2026"
});
```

**Best for:** Teams, die bereits TypeScript/React/Next.js nutzen

---

## Multi-Agent Design Patterns

### Pattern 1: Supervisor Architecture

Ein Haupt-Agent koordiniert Sub-Agenten als Tools:

```typescript
const supervisorAgent = {
  systemPrompt: `Du bist der Supervisor. Du hast Zugriff auf:
    - researcher: Für Informationssammlung
    - analyst: Für Datenanalyse
    - writer: Für Report-Erstellung

    Koordiniere die Agenten, um die Aufgabe zu erfüllen.`,

  tools: [
    {
      name: "delegate_to_researcher",
      description: "Delegiert Research-Aufgaben",
      execute: (task) => researcherAgent.run(task)
    },
    {
      name: "delegate_to_analyst",
      description: "Delegiert Analyse-Aufgaben",
      execute: (task) => analystAgent.run(task)
    }
  ]
};
```

```
┌─────────────────────────────────────┐
│           SUPERVISOR                │
│                                     │
│    ┌─────────────────────────┐     │
│    │   Task Routing Logic    │     │
│    └───────────┬─────────────┘     │
│                │                    │
│    ┌───────────┼───────────┐       │
│    ▼           ▼           ▼       │
│ ┌─────┐   ┌─────────┐   ┌──────┐  │
│ │Rsch │   │ Analyst │   │Writer│  │
│ └─────┘   └─────────┘   └──────┘  │
└─────────────────────────────────────┘
```

### Pattern 2: Handoff Chain

Agenten übergeben Kontrolle sequentiell:

```typescript
interface HandoffResult {
  output: string;
  nextAgent: string | null;
  context: Record<string, any>;
}

const agents = {
  intake: async (input: string): Promise<HandoffResult> => {
    // Verarbeite initiale Anfrage
    const classified = await classifyIntent(input);
    return {
      output: classified.summary,
      nextAgent: classified.category === "research" ? "researcher" : "direct",
      context: { classification: classified }
    };
  },

  researcher: async (context: any): Promise<HandoffResult> => {
    const research = await doResearch(context);
    return {
      output: research,
      nextAgent: "synthesizer",
      context: { ...context, research }
    };
  },

  synthesizer: async (context: any): Promise<HandoffResult> => {
    const synthesis = await synthesize(context.research);
    return {
      output: synthesis,
      nextAgent: null, // Ende der Chain
      context: { ...context, synthesis }
    };
  }
};

// Runner
async function runHandoffChain(input: string) {
  let currentAgent = "intake";
  let context: any = { input };

  while (currentAgent) {
    const result = await agents[currentAgent](context);
    context = result.context;
    currentAgent = result.nextAgent;
  }

  return context;
}
```

### Pattern 3: Parallel Execution

Mehrere Agenten arbeiten gleichzeitig:

```typescript
async function parallelAgentExecution(task: Task) {
  // Parallele Ausführung verschiedener Perspektiven
  const [
    technicalAnalysis,
    marketAnalysis,
    riskAnalysis
  ] = await Promise.all([
    technicalAgent.analyze(task),
    marketAgent.analyze(task),
    riskAgent.analyze(task)
  ]);

  // Synthese-Agent kombiniert die Ergebnisse
  const synthesis = await synthesisAgent.combine({
    technical: technicalAnalysis,
    market: marketAnalysis,
    risk: riskAnalysis
  });

  return synthesis;
}
```

---

## Framework-Auswahlhilfe

| Kriterium | LangGraph | AutoGen | Mastra |
|-----------|-----------|---------|--------|
| **Performance** | ⭐⭐⭐⭐⭐ | ⭐⭐⭐ | ⭐⭐⭐⭐ |
| **TypeScript Support** | ⭐⭐⭐⭐ | ⭐⭐⭐ | ⭐⭐⭐⭐⭐ |
| **Lernkurve** | Steil | Moderat | Flach |
| **Flexibilität** | Hoch | Sehr hoch | Moderat |
| **Enterprise-Ready** | Ja | Ja | Wachsend |
| **Community** | Groß | Groß | Wachsend |

### Entscheidungsbaum

```
Ihr Projekt erfordert...

├── Komplexe, präzise Orchestration?
│   └── → LangGraph
│
├── Kollaboratives Agent-Reasoning?
│   └── → AutoGen
│
├── TypeScript-First, schneller Start?
│   └── → Mastra
│
├── GPT-Assistants mit Guardrails?
│   └── → OpenAI Agents SDK
│
└── Bestehende LangChain-Integration?
    └── → LangGraph
```

---

## Praktisches Beispiel: Research-Pipeline

Ein vollständiges Beispiel einer Multi-Agent Research-Pipeline in LangGraph:

```typescript
import { StateGraph, START, END } from "@langchain/langgraph";
import { ChatAnthropic } from "@langchain/anthropic";
import { z } from "zod";

// Types
interface ResearchState {
  query: string;
  sources: Source[];
  analysis: string;
  report: string;
  currentStep: string;
}

interface Source {
  title: string;
  url: string;
  content: string;
  relevance: number;
}

// LLM Setup
const llm = new ChatAnthropic({
  model: "claude-3-sonnet-20240229",
  temperature: 0.7
});

// Agent: Researcher
async function researcherNode(state: ResearchState) {
  const response = await llm.invoke([
    {
      role: "system",
      content: `Du bist ein Research-Agent. Suche nach relevanten
        Quellen zum Thema und extrahiere die wichtigsten Informationen.`
    },
    {
      role: "user",
      content: `Recherchiere: ${state.query}`
    }
  ]);

  // In Produktion: Echte Web-Suche
  const sources = await searchAndExtract(state.query);

  return {
    sources,
    currentStep: "research_complete"
  };
}

// Agent: Analyst
async function analystNode(state: ResearchState) {
  const sourceSummary = state.sources
    .map(s => `- ${s.title}: ${s.content.slice(0, 200)}...`)
    .join("\n");

  const response = await llm.invoke([
    {
      role: "system",
      content: `Du bist ein Analyst. Analysiere die gesammelten
        Informationen und identifiziere Kernerkenntnisse, Trends
        und Muster.`
    },
    {
      role: "user",
      content: `Analysiere diese Quellen:\n${sourceSummary}`
    }
  ]);

  return {
    analysis: response.content,
    currentStep: "analysis_complete"
  };
}

// Agent: Writer
async function writerNode(state: ResearchState) {
  const response = await llm.invoke([
    {
      role: "system",
      content: `Du bist ein technischer Writer. Erstelle einen
        strukturierten Report basierend auf der Recherche und Analyse.`
    },
    {
      role: "user",
      content: `
        Ursprüngliche Frage: ${state.query}

        Analyse: ${state.analysis}

        Quellen: ${state.sources.map(s => s.title).join(", ")}

        Erstelle einen professionellen Report.
      `
    }
  ]);

  return {
    report: response.content,
    currentStep: "complete"
  };
}

// Graph aufbauen
const workflow = new StateGraph<ResearchState>({
  channels: {
    query: { value: (_, b) => b ?? _ },
    sources: { value: (_, b) => b ?? _ },
    analysis: { value: (_, b) => b ?? _ },
    report: { value: (_, b) => b ?? _ },
    currentStep: { value: (_, b) => b ?? _ }
  }
})
  .addNode("researcher", researcherNode)
  .addNode("analyst", analystNode)
  .addNode("writer", writerNode)
  .addEdge(START, "researcher")
  .addEdge("researcher", "analyst")
  .addEdge("analyst", "writer")
  .addEdge("writer", END);

const app = workflow.compile();

// Ausführen
async function runResearchPipeline(query: string) {
  const result = await app.invoke({
    query,
    sources: [],
    analysis: "",
    report: "",
    currentStep: "init"
  });

  return result.report;
}

// Nutzung
const report = await runResearchPipeline(
  "Aktuelle Trends in Agentic AI für 2026"
);
console.log(report);
```

---

## Best Practices

### 1. State Management

```typescript
// ❌ Schlecht: Gesamter State bei jedem Schritt
interface BadState {
  fullHistory: Message[]; // Wächst unbegrenzt
}

// ✅ Gut: Nur relevanter State
interface GoodState {
  currentContext: string;      // Zusammenfassung
  lastAgentOutput: string;     // Nur letztes Ergebnis
  metadata: { step: number };  // Tracking
}
```

### 2. Error Handling

```typescript
async function robustAgentNode(state: State) {
  const maxRetries = 3;
  let lastError: Error;

  for (let i = 0; i < maxRetries; i++) {
    try {
      return await executeAgent(state);
    } catch (error) {
      lastError = error;
      await delay(Math.pow(2, i) * 1000); // Exponential backoff
    }
  }

  // Graceful degradation
  return {
    ...state,
    error: lastError.message,
    fallbackUsed: true
  };
}
```

### 3. Token-Budget

```typescript
function enforceTokenBudget(state: State, maxTokens: number) {
  const currentTokens = estimateTokens(state);

  if (currentTokens > maxTokens) {
    // Komprimiere History
    state.history = summarizeHistory(state.history);
  }

  return state;
}
```

---

## Fazit

Multi-Agent-Systeme sind 2026 der Standard für komplexe AI-Anwendungen. Die Framework-Wahl hängt von Ihrem Use Case ab:

- **LangGraph** für Performance-kritische, komplexe Workflows
- **AutoGen** für flexible, kollaborative Agent-Interaktionen
- **Mastra** für TypeScript-native Entwicklung mit schnellem Start

Starten Sie mit einem einfachen 2-3 Agent System und skalieren Sie schrittweise. Die Komplexität von Multi-Agent-Orchestration sollte nicht unterschätzt werden – aber die Möglichkeiten sind enorm.

---

## Bildprompts für diesen Artikel

**Bild 1 – Hero Image:**
"Network diagram of interconnected colorful nodes representing different AI agents, flowing data streams, isometric 3D style, dark background"

**Bild 2 – Orchestration Pattern:**
"Orchestra conductor controlling multiple robotic musicians, each representing a specialized AI agent, dramatic stage lighting"

**Bild 3 – Technical Architecture:**
"Blueprint-style technical drawing showing agent communication flows, clean lines, engineering aesthetic, white and blue color scheme"

---

## Quellen

- [LangChain Docs: Multi-Agent Workflows](https://docs.langchain.com/oss/python/langchain/multi-agent)
- [LangGraph: Multi-Agent Workflows](https://www.blog.langchain.com/langgraph-multi-agent-workflows/)
- [AIMultiple: Agentic Orchestration Frameworks](https://research.aimultiple.com/agentic-orchestration/)
- [Kanerika: AutoGen vs LangChain 2026](https://kanerika.com/blogs/autogen-vs-langchain/)
- [Vellum: Top AI Agent Frameworks](https://www.vellum.ai/blog/top-ai-agent-frameworks-for-developers)
