تنسيق متعدد الوكلاء: ما بعد الذكاء الاصطناعي الخطي مع LangGraph.js

١. التحول إلى آلات الحالة القائمة على الرسوم البيانية

في عام ٢٠٢٤، استخدمنا “السلاسل”. في عام ٢٠٢٦، نستخدم **الرسوم البيانية**. باستخدام LangGraph.js، نتعامل مع سير عمل الذكاء الاصطناعي لدينا كرسوم بيانية دورية موجهة (DAG) حيث تمثل العقد الوكلاء أو الأدوات، وتمثل الحواف تدفق المنطق. هذا يسمح بـ دعم الحلقات—حيث يمكن لوكيل “المحرر” إرسال العمل مرة أخرى إلى وكيل “الكاتب” إذا فشل فحص الجودة.

٢. إعداد البيئة: Vite + وكيل Node آمن

يتطلب أمان الإنتاج لعام ٢٠٢٦ وكيل ذكاء اصطناعي بلا ثقة. يجب أن تمر جميع استدعاءات React من جانب العميل عبر وسيط Node.js الذي يتحقق من الهوية، يفرض حدود المعدل، ويخفي مفاتيح API الخام للنماذج مثل GPT-5.5 أو Gemini 4.

# 1. Initialize Vite (The 2026 Standard)
npm create vite@latest multi-agent-ui -- --template react-ts
cd multi-agent-ui

# 2. Install the Agentic Stack
npm install @langchain/langgraph @langchain/openai @modelcontextprotocol/sdk zod
        

٣. تنفيذ الرسم البياني متعدد الوكلاء

سنقوم بتعريف مخطط الحالة الذي يشاركه وكلاؤنا. هذه “الذاكرة المشتركة” تسمح لوكيل البحث بترك ملاحظات لوكيل التنفيذ.

import { StateGraph, END } from "@langchain/langgraph";
import { Annotation } from "@langchain/langgraph/web";

// Define shared 'Short-term' Memory
const AgentState = Annotation.Root({
  messages: Annotation<BaseMessage[]>({
    reducer: (x, y) => x.concat(y),
  }),
  next_step: Annotation<string>(),
});

// Define Nodes (The Agents)
const researchNode = async (state: typeof AgentState.State) => {
  // Logic for a researcher agent using MCP tools
  return { messages: [new AIMessage("Researched data...")], next_step: "writer" };
};

const graph = new StateGraph(AgentState)
  .addNode("researcher", researchNode)
  .addEdge("researcher", END)
  .compile();
        

٤. تفاعل الأدوات عبر MCP (بروتوكول سياق النموذج)

في عام ٢٠٢٦، لم نعد نكتب “إضافات” مخصصة لكل تطبيق. نستخدم MCP للسماح لوكلائنا بالاتصال مباشرة بالملفات المحلية، Google Drive، أو Slack. هذا يقيِّس كيفية “رؤية” الذكاء الاصطناعي لبيانات مؤسستك.