CopilotKit ra mắt mã nguồn mở Open Generative UI: khung liên tác đa tác nhân để triển khai Claude Artifacts

CopilotKit 的開源 AI Agent 前端框架在 5 月 7 日宣布推出 Open Generative UI，這是 Anthropic Claude Artifacts 功能的開源實作。akshay_pachaar 整理說明：CopilotKit 的版本讓 Agent 在執行時動態生成 HTML/SVG，並以 token-by-token 串流方式顯示在沙盒化的 iframe 中，用戶能即時看到介面組裝過程，不必等到完整回應。在 Anthropic Claude Artifacts 之前，生成式 UI 能力只存在於 Anthropic 自家產品內；CopilotKit 將同樣模式對外開源，能整合到任何 app。

核心機制：Agent 即時生成 HTML/SVG、串流到沙盒化 iframe

Open Generative UI 的技術設計：

Agent 不從預先建好的元件選用，而是每次從零生成任意視覺內容

輸出以 HTML/SVG 形式 token-by-token 串流到沙盒化 iframe

iframe 完全隔離，無法存取父 app、DOM 或用戶資料

即使 Agent 產生破損標記或意外 JavaScript，也不會洩漏到 iframe 外

開發者可透過「skill prompts」引導 Agent 產出特定視覺格式（如 Chart.js dashboard 含座標軸標籤、3D 模型含旋轉控制等）

沙盒設計是處理「Agent 任意生成程式碼」風險的標準作法——讓 Agent 自由產出但限制其執行範圍，不破壞主應用安全邊界。

相容範圍：LangGraph／CrewAI／Mastra／Google ADK／AWS Strands

Open Generative UI 建立在 AG-UI 協議之上，開箱即用相容多個 Agent 框架：

LangGraph

CrewAI

Mastra

Google ADK

AWS Strands

同時提供獨立 MCP（Model Context Protocol）伺服器，可插入 Claude Code、Cursor 或任何相容 MCP 的客戶端使用。整套方案建立在 CopilotKit 的開源前端框架上；CopilotKit 在 GitHub 已累積超過 30,000 顆星，提供 React、Next.js、Angular、Vue 的 SDK。

對 AI Agent 開發者的意義：跨框架、跨模型的 GenUI 標準

本次釋出對 AI Agent 應用層的意義：

過去開發者要在自家 app 中加入「Claude Artifacts 風格的動態 UI」需要自行從零實作

Open Generative UI 提供一個開源、跨框架、跨模型的選擇

透過 MCP 伺服器、Claude Code 與 Cursor，用戶可直接接入

後續可追蹤的具體事件：CopilotKit Open Generative UI 在 LangChain／CrewAI 社群的採用率、Anthropic 對「Claude Artifacts 被開源實作」的官方反應，以及其他 Agent 框架是否提供類似 GenUI 能力。

這篇文章 CopilotKit 開源 Open Generative UI：Claude Artifacts 跨 Agent 框架實作 最早出現於 鏈新聞 ABMedia。