画界面 — agent 回的不止文字,还有可交互的 UI

← 回总纲

1. 这条分支是什么

共性落到“呈现面”:

agent 常需要回一个可交互界面(表单、卡片、购物车、图表),这条分支标准化“界面怎么从 agent/server 过线到宿主、宿主怎么安全沙箱地渲染它”。

第一性原理:把 UI 交给 agent 渲染有两条根本不同的路——要么 agent 流式发一串“发生了什么”的事件(由前端自己据此更新),要么 agent 发一棵“画成什么样”的声明式树/一段 UI 资源(由宿主直接渲染)。这条“事件 vs 声明式”的分野是理解本分支的钥匙。

2. 分支内有哪几种做法(流派)

画界面
├── 声明式 / UI 资源(发“画什么”)
│   ├── MCP Apps ........... UI-over-MCP 官方扩展,`ui://` 资源 + 沙箱 + CSP/CORS
│   ├── MCP-UI ............. 同模型的社区 SDK(TS/Python/Ruby),MCP Apps 的实现料
│   ├── OpenAI Apps SDK .... ChatGPT 侧 UI-over-MCP 样例(与 MCP Apps 对应)
│   └── A2UI ............... Google 声明式 UI 组合协议(组件目录 + 渲染器契约)
└── 事件流(发“发生了什么”)
    └── AG-UI .............. 后端→前端的 agent UI 事件协议(文本/工具/状态事件 + 状态同步)

3. 对比矩阵

库	范式	过线的是什么	宿主/渲染侧	与 MCP 的关系	成熟度	代码锚点
mcp-apps-ext	声明式 / UI 资源	ui:// 资源(模板),配 CSP/CORS、authorization 约束	iframe 沙箱;host↔server↔iframe 交互模式	MCP 的官方扩展,随 MCP 修订演进	UI-over-MCP 主参考方向	mcp-apps-ext/docs/overview.md:105(ui:///template)、csp-cors.md、authorization.md
mcp-ui-sdk	声明式 / UI 资源	UI 资源载荷(server 发、host 渲)	TS/Python/Ruby SDK 两侧	MCP Apps 的社区实现料 + 生态兼容	社区,生态过渡期	mcp-ui-sdk/sdks/typescript、python、ruby
openai-apps-sdk	声明式 / UI 资源	ChatGPT App 的 UI 组件(Node/Python 样例)	ChatGPT 侧渲染模型;含鉴权样例	ChatGPT 特化,经 migrate 文档映射到开放 MCP Apps	仅样例仓,normative 文档在 developers.openai.com	openai-apps-sdk/kitchen_sink_server_node/;映射见 mcp-apps-ext/docs/migrate_from_openai_apps.md
a2ui	声明式 UI 树	一棵 declarative UI 树 + 组件目录/发现握手	多平台渲染器(web、Flutter)+ 一致性要求	与 MCP 独立;补“画什么”,与 AG-UI 互补	pre-1.0(v0.9 线),钉版本目录	a2ui/specification/(版本化契约)、renderers/、agent_sdks/
ag-ui	事件流	后端流式发的 UI 事件(text/tool/state) + 状态快照/补丁	前端据事件更新;有框架桥(LangGraph/CrewAI/Mastra)	与 MCP 独立;描述事件流而非 UI 树	事件词表按 minor 增长,钉 commit	ag-ui/docs/concepts/events.mdx、state.mdx、tools.mdx

4. 模式与权衡

• 声明式 vs 事件流,按“谁拥有渲染逻辑”选。 声明式(MCP Apps/A2UI)把“画成什么样”交给 agent/server,宿主只渲染 → 跨宿主一致、但宿主要信任并沙箱外来 UI;事件流(AG-UI)把渲染逻辑留在前端,后端只播“发生了什么” → 前端控制力强、但前后端要共享一套事件词表。
• A2UI 与 AG-UI 不是竞品,是两半。 A2UI 描述画什么(UI 树),AG-UI 描述周围的事件流——一个补呈现、一个补流转,可同时用。
• MCP Apps 是新工作的首选参考;MCP-UI/OpenAI Apps 是实现料。 做 UI-over-MCP 新项目以 mcp-apps-ext 为准;MCP-UI 用于生态兼容,OpenAI Apps SDK 用于 ChatGPT 侧并经 migrate 文档映射回开放扩展。
• 沙箱与授权是这条分支的硬约束。 外来 UI 进 iframe,CSP/CORS 与 authorization 不是可选项(见 mcp-apps-ext 的 csp-cors.md/authorization.md)。

5. 趋势

• UI-over-MCP 正从社区 MCP-UI 收敛到官方 MCP Apps 扩展;OpenAI Apps SDK 经迁移文档对齐开放模型。新项目押 MCP Apps。
• 事件流侧(AG-UI)靠框架桥扩张采用面;事件词表按 minor 版本增长,适配器钉 commit。

6. 代表作 + 深入

• 首读: mcp-apps-ext(docs/overview.md 是契约本体)。 (TODO: 待 mcp-apps-ext 子库 doc)
• 实现料:mcp-ui-sdk、openai-apps-sdk。 (TODO: 待各子库 doc)
• 另一范式:ag-ui(事件流)、a2ui(声明式树)。 (TODO: 待各子库 doc)