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:

März 2025: OpenAI Agents SDK ersetzt Swarm
Oktober 2025: Microsoft merged AutoGen mit Semantic Kernel
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:

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:

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:

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:

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:

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:

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:

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

// ❌ 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

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

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"

Kontakt