A2UI 渲染器生态全景指南社区实现、跨平台能力与提交规范【免费下载链接】a2ui项目地址: https://gitcode.com/GitHub_Trending/a2/a2uiA2UIAgent-to-User Interface是一套让 AI Agent 以声明式 JSON 生成交互界面的协议。本文以官方生态系统清单为骨架系统梳理社区与第三方 A2UI 渲染器实现——覆盖 React、Vue、Svelte、React Native、Jetpack Compose、SwiftUI、Lynx、终端 CLI 等十余个平台与框架逐一分析各实现的版本支持v0.8 / v0.9、技术架构与安全模型并给出向官方生态列表提交自己渲染器的完整流程与评审标准。读完本文你将能基于版本矩阵与功能纵深完成渲染器选型并按照规范将自研渲染器收录进 A2UI 生态。一、理解 A2UI 渲染器生态官方维护与社区实现的分工在 A2UI 协议中渲染器Renderer负责把 Agent 发来的 A2UI JSON 消息转换成各平台的原生 UI 组件。官方文档用了一个贴切的类比A2UI 协议就像 HTMLAgent 就像提供页面的服务器而渲染器就像浏览器——正如 HTML 有多个浏览器内核A2UI 也有多个渲染器实现详见 Renderers (Client Libraries)。仓库中官方维护的渲染器位于 renderers/ 目录覆盖以下平台渲染器平台v0.8v0.9.1v1.0仓库路径ReactWeb✅ Stable✅ Stable Plannedrenderers/reactLit (Web Components)Web✅ Stable✅ Stable Plannedrenderers/litAngularWeb✅ Stable✅ Stable Plannedrenderers/angularFlutter (GenUI SDK)Mobile/Desktop/Web✅ Stable✅ Stable Planned由 Flutter GenUI SDK 提供而本文主角——社区渲染器——正是围绕这些官方实现之外的长尾平台生态。社区渲染器由各自的作者维护而非 A2UI 团队维护因此在选型时务必逐一确认其兼容性、协议版本支持与维护状态。渲染器栈社区实现背后的统一架构无论官方还是社区A2UI 渲染器的功能都可以按 Glossary 中的渲染器栈定义拆分为可独立开发、复用的四层Core Library描述 Catalog 并与 Agent 交互所需的基础原语例如 JavaScript web core 库Catalog Schema以 JSON 形式定义的组件目录例如 Basic Catalog schemaFramework Adapter把 Agent 指令在具体框架中执行的适配层例如 JS 核心适配到 Angular/Electron/React/LitDart 核心适配到 FlutterCatalog Implementation目录 schema 在某一框架中的具体实现。对于 Web 侧的新渲染器Renderer Implementation Guide 明确建议直接复用a2ui/web_core它已经提供了MessageProcessor处理 JSONL 流、分发消息、管理 surface 生命周期、SurfaceModel/DataModel/DataContext/ComponentModel等状态与数据绑定层以及完整的 TypeScript 类型与 JSON schema 校验。自研渲染器只需完成三件事把 A2UI 组件类型映射到框架组件、订阅状态变化并重新渲染、把用户操作转发回 MessageProcessor。二、社区渲染器总览完整版本支持矩阵下表完整收录 Ecosystem Renderers 中列出的全部社区渲染器。需要说明原文表格中的“Links”列指向各项目的 GitHub / npm 页面本文以仓库与包标识符形式呈现直接链接可在生态页原文中查看。渲染器包名平台v0.8v0.9简介easyops-cn/a2ui-sdka2ui-sdk/reactReact (Web)✅❌功能最完整的社区 React 渲染器基于 Radix UI 原语与 Tailwind CSS拥有独立文档站点lmee/A2UI-AndroidAndroid (Compose)✅❌唯一的 Jetpack Compose 渲染器覆盖 Android 5.020 组件sivamrudram-eng/a2ui-react-nativeReact Native✅❌唯一的 React Native 渲染器一套代码同时覆盖 iOS 与 Androidzhama/a2uiReact (Web)✅❌React 实现jem-computer/A2UI-reactReact (Web)✅❌React 实现BBC6BAE9/a2ui-swiftApple 原生SwiftUI、UIKit、AppKit✅✅严格贴近官方规范的 Apple 原生渲染器经共享A2UISwiftCore层支持五大 Apple 平台a2ui-vueshawnwang15/a2ui-vueVue (Web)✅✅Vue 实现带独立文档站点AGenUI/AGenUIiOS、Android、HarmonyOS❌✅共享 C 核心的跨平台原生渲染器专注高性能与跨端一致性lynx-family/lynx-stacklynx-js/genui/a2uiLynx移动、Web、桌面❌✅ReactLynx 渲染器通过MessageStore消费消息、经onAction回传操作BoteAI/a2uiboteai/a2ui-renderReact (Web)✅✅同时支持 v0.8 与 v0.9 的 React 渲染器kokoro-ele/a2ui-inkevanyu/a2ui-inkTerminal / CLI (Ink)❌✅面向终端 CLI 的 Ink 渲染器让 Agent UI 走进命令行yessGlory17/generative-muiyessglory/generative-mui-reactReact Material UI (Web)❌✅将 18 个 Basic Catalog 组件一对一映射到 MUI运行在宿主ThemeProvider之内ChaliceForAuri/a2ui-sveltesvelte-a2uiSvelte 5 (Web)❌✅原生基于 runes 构建面向 v1.0 Candidate 规范从矩阵可以清晰看出两条生态脉络v0.8 时代以 React Web 渲染器为主easyops-cn/a2ui-sdk、zhama、jem-computer、BoteAI并催生了 Android Compose 与 React Native 两大移动端空白填补者v0.9 时代则向多端全面爆发——Apple 原生、Lynx、Svelte、MUI、终端 CLI、跨端 C 渲染器相继出现。选型时建议直接对照该矩阵先确认目标平台再确认所需协议版本。三、重点社区渲染器深度解析原文的 Highlights 部分对主要社区实现进行了详细剖析以下逐项展开。1. easyops-cn/a2ui-sdk功能最完整的社区 React 渲染器该实现是目前社区中功能最全的 React 渲染器已发布 11 个版本基于 Radix UI 原语构建使用 Tailwind CSS 完成样式并配有专门的文档站点。它最初在 A2UI 官方 Discussions编号 489中宣布。如果你需要官方维护之外的 React 生态选项例如更激进的定制样式体系这是一个重要参考而官方 React 渲染器仍是a2ui/react对应仓库内实现见 renderers/react。2. lmee/A2UI-Android填补 Jetpack Compose 空白的原生实现这是目前唯一的 Jetpack Compose 渲染器覆盖 Android 5.0提供 20 组件、数据绑定data binding与无障碍accessibility支持。对希望在 Android 原生应用中直接渲染 Agent UI 的团队这是 v0.8 时代的默认选择。需注意它当前只支持 v0.8 协议。3. sivamrudram-eng/a2ui-react-native一套代码双端复用这是唯一的 React Native 渲染器通过 RN 的跨平台能力让 A2UI 同时覆盖 iOS 与 Android。对于已经基于 React Native 构建移动应用的团队这意味着无需引入两套原生渲染栈即可在既有工程中接入 A2UI。4. BBC6BAE9/a2ui-swift遵循规范的 Apple 原生全平台渲染器这是一个基于 Swift、严格贴近 A2UI 官方规范的 Apple 原生渲染器。核心设计如下通过共享的A2UISwiftCore层同时支撑SwiftUI、UIKit、AppKit三种 UI 框架覆盖iOS、iPadOS、macOS、tvOS、visionOS、watchOS六大 Apple 平台同时支持A2UI v0.8、v0.9、v0.9.1三个协议版本设计哲学是“规范级互操作性与 Apple 原生平台表达优先于跨平台像素级一致”——默认渲染使用原生 Apple 控件遵循 Human Interface Guidelines 的交互模式同时允许应用通过 A2UI 的 catalogs、themes 与自定义组件定制样式和行为。5. AGenUI/AGenUIC 核心驱动的 iOS / Android / HarmonyOS 跨端渲染器AGenUI 是面向 A2UI v0.9 的跨平台原生渲染器覆盖 iOS、Android、HarmonyOS 三大移动生态核心基于共享 C 代码库设计目标为高性能、可扩展与跨端一致性。它完整实现了 A2UI v0.9并提供运行时 API 用于扩展 UI 组件与函数调用。此外AGenUI 通过自定义 Catalog 在 Basic Catalog 基础上扩展了Table、Carousel、Web、RichText组件以及用于更丰富外观与布局控制的Styles 属性同时保持与 A2UI 可扩展 Catalog 模型的兼容——这与官方 自定义 Catalog 的理念一脉相承。6. lynx-family/lynx-stackReactLynx 生态的 A2UI 渲染器lynx-stack 通过lynx-js/genui/a2ui子路径对外暴露 A2UI 渲染能力为 Lynx移动、Web、桌面提供 v0.9 支持。其工作机制是通过MessageStore消费经过校验的 server-to-client A2UI 消息从调用方提供的 catalogs 中渲染白名单内的 ReactLynx 组件并把生成的 UI 操作通过onAction转发回 Agent。配套的 GenUI CLI 还支持在构建期生成 catalog 产物与 A2UI system prompt把协议接入沉淀到构建流程中。7. yessGlory17/generative-mui主题继承式 Material UI 渲染器generative-muiyessglory/generative-mui-react是面向 A2UIv0.9.1的 Material UI 渲染器值得关注的设计点包括18 个 Basic Catalog 组件一对一映射到 MUI且渲染发生在宿主应用既有的ThemeProvider内部——surface 自身不带主题直接继承宿主调色板与排版主题切换时整体重新换肤架构上拆分为框架无关核心yessglory/generative-mui-coreZod schemas、JSONL 解析器、JSON Pointer、确定性的可订阅SurfaceStore、与 Provider 无关的 Agent 工具 schema与React/MUI 适配器两层且通过 lint 规则强制react → core的单向依赖在 Basic Catalog 之外提供可选的Extended Catalog基于mui/x-charts的图表、Table 等支持双向数据绑定、checks驱动的校验、流式渲染韧性增量骨架、仅追加字符串增量、cycle/depth 与逐节点错误边界内置安全护栏未注册的类型绝不执行、来自 Agent 的sx/style/className一律剥离、本地regex施加 ReDoS 长度上限。8. ChaliceForAuri/a2ui-svelte基于 runes 的 Svelte 5 渲染器a2ui-svelte是原生基于 Svelte 5runes构建的渲染器目标为v1.0 Candidate 规范组件属性名与 v0.9 共享。它的功能覆盖极具代表性完整支持Basic Catalog 全部 18 个组件、59 个名称的完整Icon枚举外加{svgPath}变体、全部 14 个内置函数、checks校验与集合模板collection templates并在测试套件中直接重放规范自带的 contact-form 测试数据协议核心是一个采用结构共享structural sharing的纯 reducer存放于$state.raw中未变化的组件完全跳过重渲染威胁模型假设 Agent 为敌对方catalog 白名单、剥离on*/函数属性、拒绝原型污染prototype pollution、文本一律转义后再标记、递归深度受限、强制callableFrom约束传输层支持HTTP JSONL/SSE、A2A 扩展绑定application/a2uijsonDataParts、渲染器元数据提升与AG-UI activities含中间件的a2ui-surface类型且每条出站消息都会声明a2uiRendererCapabilities样式完全由宿主持有的 CSS 自定义属性驱动项目采用 Apache-2.0 许可证并提供了流式演示 booking-form 场景的在线 Demo。四、值得关注的早期项目Notable Mentions以下项目处于早期或实验阶段社区欢迎它们但请谨慎评估生产可用性xpert-ai/a2ui-reactxpert-ai/a2ui-react——基于 ShadCN UI 组件的 React 渲染器v0.0.12026 年 1 月发布josh-english-2k18/a2ui-3d-renderer——基于 Three.js/WebGL 的实验性 A2UI 3D 渲染器AINative-Studio/ai-kit-a2ui——面向 AIKit 框架的 React ShadCN 渲染器。五、周边生态相关项目、Agent 侧库与生态工具相关项目json-rendervercel-labs/json-renderjson-render/*是 Vercel 出品的生成式 UI 框架覆盖 React、Vue、Svelte、Solid、React Native。需要特别区分的是它使用自己的 JSON schema而非 A2UI 协议基于 Zod 定义组件 catalog支持流式输出与 36 个预置 shadcn/ui 组件可跨平台渲染。它属于“协议相近但不相通”的同类竞品理解其差异有助于在技术选型时做对比官方生态页与 A2UI in the World 中均有记录。Agent 侧库prefabMax-Health-Inc/prefabmaxhealth.tech/prefab是一个TypeScript 服务端组件库它不是渲染器而是从类型化组件树产出 A2UI 消息并提供诊断能力提示哪些内容 Basic Catalog 无法表达。它还能通过 MCP 以a2ui://资源或内嵌资源的形式提供 A2UI 消息。对于希望“服务端声明组件、客户端渲染”的架构这类 Agent 侧库与渲染器互为上下游。生态工具a2ui/markdown-ita2ui/markdown-it是一个被所有 JS 渲染器共用的生态工具它让各渲染器的 Text 组件支持 Markdown 渲染。仓库内对应实现位于 renderers/markdown/markdown-it使用 markdown-it 与 dompurify通过预配置的renderMarkdown函数注入各渲染器的 Markdown Renderer 服务从而保证跨渲染器配置一致测试时因 dompurify 依赖 Window 对象需要全局提供 jsdom。六、如何把自研渲染器提交进官方生态列表如果你已经构建了自己的 A2UI 渲染器官方欢迎通过以下流程收录Forka2ui-project/a2ui仓库编辑本文件仓库路径docs/ecosystem/renderers.md——在 Community Renderers 表格中新增一行填写渲染器名称、平台、npm 包名如有、版本支持情况与源码链接提交 PR到a2ui-project/a2ui附上一段简短的项目描述在 GitHub Discussions 发帖让社区看到你的成果——一段简短的演示视频会大大提升关注度。需要灵感仓库内的 samples 目录提供了官方维护的社区样例包括 Angular 客户端的 restaurant_finder、Lit 客户端 shell、React 客户端 shell 以及 Flutter 客户端 restaurant_finder它们是理解“Agent 渲染器”端到端接线方式的最佳起点。一个“好”的社区渲染器应该满足什么标准官方在 Ecosystem Renderers 中给出了明确的质量门槛公开源码优先开源推荐 MIT 或 Apache 2.0 许可证明确声明支持的 A2UI 规范版本v0.8、v0.9 或两者覆盖 Basic Catalog 的基础组件文本、按钮、输入框、基础布局组件等与其它渲染器保持一致体验提供 README包含安装说明与最小可用示例处于活跃维护状态——如果不再维护请标记为 archived。值得注意的是社区列表不要求渲染器达到生产级——实验性与早期项目欢迎进入 Notable Mentions 分区。这降低了社区贡献的门槛让新平台、新框架的适配可以尽早公开迭代。七、选型建议与下一步综合版本矩阵与纵深分析可以归纳出三条选型主线Web 端官方 React、Lit、Angular 渲染器稳定覆盖 v0.8/v0.9.1需要 Vue、Svelte、MUI 等框架时可分别在 a2ui-vue、a2ui-svelte、generative-mui 中按版本支持度筛选。所有 Web 渲染器共享 web_core 的协议处理层行为一致性有保障。移动与桌面原生Android 首选 lmee/A2UI-AndroidComposev0.8或 AGenUICv0.9Apple 全平台首选 BBC6BAE9/a2ui-swiftv0.8/v0.9/v0.9.1跨 iOS/Android 且有 RN 基础可选 a2ui-react-nativeLynx 生态则选lynx-js/genui。特殊场景终端 CLI 场景可探索 kokoro-ele/a2ui-ink注重与宿主设计系统融合继承主题、安全护栏可关注 generative-mui。更完整的官方渲染器清单见 Renderers (Client Libraries)实现层面的硬性要求JSONL 解析、消息分发、surface 管理、组件缓冲、数据绑定、渐进渲染、客户端函数等见 Renderer Implementation Guide接入步骤见 Client Setup Guide。生态列表会随社区贡献持续更新最新收录情况请以 Ecosystem Renderers 原文 为准。【免费下载链接】a2ui项目地址: https://gitcode.com/GitHub_Trending/a2/a2ui创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考