A2UI 驱动的 Lynx 生成式界面

所有文章
2026年6月8日
胡静
胡静工程师 @ Lynx
王浩阳
王浩阳工程师 @ Lynx
艾浩
艾浩工程师 @ Lynx
高晨超
高晨超工程师 @ Lynx
方舟
方舟工程师 @ Lynx
夏梦非
夏梦非组件主管 @ Lynx
赵靖凯
赵靖凯框架主管 @ Lynx
黄玄
黄玄架构师 @ Lynx

自 AI Agent 兴起以来,我们一直在思考:如何让 Agent 驱动的生成式 UI 真正像原生 UI 一样融入真实的应用。Lynx 在这件事上有天然优势:它在 Mobile、Web、Desktop 上原生渲染,并能直接嵌入到你已有的应用中。所以当 Google 推出 Agent-to-UI 协议 A2UI,一个让 AI Agent 安全生成富交互界面、无需执行任意代码的开放协议时,我们觉得这是个很自然的契合点。

今天,我们的 A2UI 渲染器正式发布,把生成式 UI 带到 Lynx 上。

Lynx A2UI Overview
Agent 负责推理,Lynx 负责渲染。

流式生成,原生渲染

A2UI 协议天然支持流式传输: Agent 一边推理一边发送 UI 片段,客户端逐步渲染。 这种渐进式的交互模式让用户不再面对空白等待,而是看着界面随 Agent 的输出逐步成型。

Lynx A2UI 继承了 Lynx 的 双线程架构:A2UI 协议消息在后台线程完成解析,UI 更新则提交到主线程呈现,两者并行互不阻塞。 即使 Agent 高频输出大量 UI 片段,界面依然保持流畅响应。

<A2UI> 容器在后台线程解析协议消息,在主线程提交 UI 更新;即使消息频率很高,界面也能保持响应。

基于 lynx-ui 的能力目录

A2UI 的核心机制是 能力目录(Catalog): 客户端向 Agent 声明自己支持哪些组件、函数和参数,Agent 只能在授权范围内选择。 这约束了生成边界,而每个组件具体如何渲染,则交由各端的渲染器决定。

Lynx A2UI 内置了一套基于 lynx-ui默认组件目录,涵盖按钮、列表、弹窗等常见组件,开箱即用。 在默认目录之外,开发者通常还会 定义自己的组件,将业务能力注册到 Catalog 中,供 Agent 在对话中按需调用。

Lynx GenUI Playground 中的默认 Catalog,可直接交互。

可编程的 Action

A2UI 通过 Action 机制 处理用户交互:组件以结构化的方式描述用户意图,而不是执行任意代码。协议层面还把 Action 分成了两类:functionCall 在本地执行,Agent 完全不知情;event 则会回传给 Agent 继续推理。

Lynx A2UI 在协议之上提供了一层 API 抽象。<A2UI> 渲染容器订阅一个 MessageStore,按到达顺序保存原始协议消息。每当一个 Action 触发,onAction 会把它整理成统一的 { name, context } 交给应用:要么往同一个 store 里塞一条新消息,让界面立刻更新;要么发给后端 Agent,再把流式响应写回同一个 store。

将 Action 转发给 Agent,或在渲染侧消费它,直接驱动 UI 更新。

立即体验

Lynx GenUI Playground 提供了完整的交互体验,覆盖从模型对话到 UI 渲染的全链路。 无需本地搭建,打开浏览器即可与 Agent 对话并实时观察界面逐步生成。如果想在真机上感受原生渲染的效果,下载 Lynx Explorer,扫描页面中的二维码即可在移动设备上实时体验。

阅读 ReactLynx 中的 A2UI 指南,或直接查看更详细的 接入文档预览版 将 Lynx A2UI 集成到你的应用中。对应的 npm 包是 @lynx-js/genui/a2ui,支持从 A2UI 0.9 开始;我们也会与 Google 的 A2UI 团队一起适配 v1.0 候选版本。 如果你在使用中遇到问题、有功能建议,或想分享你的实践案例,欢迎在 GitHub 上提交 Issue 或参与讨论。

我们相信,AI 时代的跨平台框架不应只是能运行 AI 生成的代码,而应当为 Agent 提供一条安全、高效、原生的界面通道。Lynx A2UI 是我们在这个方向上迈出的第一步,我们也期待与社区一起探索 Open UI 等生成式 UI 的更多可能。

除非另有说明,本项目采用知识共享署名 4.0 国际许可协议进行许可,代码示例采用 Apache License 2.0 许可协议进行许可。