A2UI：面向 Agent 的声明式 UI 协议（一）：A2UI 是什么
本文是 A2UI 技术博客系列的第一篇，将介绍 A2UI 的基本概念、要解决的问题以及核心价值。后续文章将深入实践实现和技术架构。
1.1 定义
A2UI（Agent to UI）是一种面向 Agent 驱动界面的声明式 UI 协议。
AI Agent 生成 JSON 格式的 UI 描述，客户端解析后用原生组件渲染，实现跨平台（Web、移动端、桌面端）的富交互界面，且无需执行任意代码。
1.2 要解决的问题
问题 1：纯文本交互效率低
传统方式（纯文本输出）：
用户："查一下苹果股票"
Agent："苹果公司（AAPL）当前股价 $145.09，涨幅 +1.23（+0.85%），
今日最高 $147.00，最低 $143.50，开盘价 $144.00，成交量 350 万股。"
用户看完还要自己比较、记忆、手动操作其他 App...
更好的方式（A2UI 富交互 UI）：
┌──────────────────────────────┐
│ AAPL Apple Inc │
│ $145.09 │
│ +1.23 (+0.85%) │
│ ─────────────────────── │
│ High: $147 Low: $143 │
│ Open: $144 Vol: 3.5M │
│ [刷新] [加入自选] │
└──────────────────────────────┘
用户点击"加入自选"后，Agent 自动响应并更新 UI：
┌──────────────────────────────┐
│ ✓ │
│ 已加入自选 │
│ │
│ AAPL - Apple Inc │
│ 已添加到您的自选列表 │
│ │
│ [查看自选] [继续查询] │
└──────────────────────────────┘
整个流程无需多轮对话，交互闭环在 UI 内完成。
问题 2：远程 Agent 无法直接操控 UI
多 Agent 系统中，Agent 运行在远端，无法直接操控客户端 UI，只能发消息。
传统方案（iframe 嵌入 HTML/JS）的问题：
- 笨重，视觉风格割裂
- 安全性复杂
- 无法匹配应用样式
核心需求：传输的 UI 既要像数据一样安全，又要像代码一样有表达力。
1.3 解决方案
A2UI 用 JSON 消息描述 UI：
- LLM 可直接生成：结构化输出，易于校验
- 协议无关传输：可通过 A2A、AG-UI、SSE、WebSocket 等任意协议传输
- 客户端原生渲染：客户端用自己的 UI 框架渲染，继承应用样式
结果：客户端掌控安全和样式，Agent 生成的 UI 感觉像原生的。
1.4 核心价值
| 价值 | 说明 |
|---|---|
| 安全 | 声明式数据，不执行代码，无安全风险 |
| 原生体验 | 无 iframe，客户端用自己的框架渲染，继承应用样式和性能 |
| 可移植 | 一份 JSON，多端渲染（Web / Flutter / SwiftUI / Compose） |
1.5 设计原则
| 原则 | 说明 |
|---|---|
| LLM 友好 | 扁平组件列表 + ID 引用，易于增量生成、纠错、流式输出 |
| 框架无关 | Agent 发送抽象组件树，客户端映射到原生控件 |
| 关注点分离 | UI 结构、应用状态、客户端渲染三层分离，支持数据绑定和响应式更新 |
1.6 A2UI 不是什么
- 不是框架：是协议，不绑定任何具体实现
- 不是 HTML 替代品：用于 Agent 生成的动态 UI，不是静态网站
- 不是完整样式系统：样式由客户端控制，服务端样式支持有限
- 不限于 Web：支持 Web、移动端、桌面端、车机等
总结
A2UI 通过声明式 JSON 协议，解决了 Agent 驱动 UI 的核心挑战：
- 让 Agent 能够安全地生成富交互界面
- 保持客户端的原生体验和样式一致性
- 实现跨平台的无缝渲染
在下一篇文章中，我们将通过一个完整的股票查询 Demo，展示 A2UI 的实际实现过程，包括 Agent 服务端和客户端的具体代码。
本系列文章：
- （一）A2UI 是什么 ← 当前文章
- （二）Demo时间之Agent服务端和客户端实现
- （三）相关概念和技术架构
