【第 3703 期】VAPD AgentKit：可组合 Agent 前端通用库实践

📌 一句话摘要

vivo 团队推出 VAPD AgentKit，以「统一消息模型 + Runtime Adapter + 前端编排」三段式架构，实现协议无关、可插拔的 Chat 模式 AI Agent 前端通用库，支持笔记、知识库、项目管理三大业务场景。

📝 详细摘要

本文由 vivo 团队分享，介绍了其自研的 VAPD AgentKit 前端通用库。该库的核心设计围绕三大业务场景（笔记、知识库、项目管理），旨在统一一套可组合的 AI Agent 能力。文章详细阐述了其「统一消息模型 + Runtime Adapter + 前端编排」的三段式架构：统一消息模型将后端返回的各类事件标准化为前端可消费的消息；Runtime Adapter 作为协议适配层，屏蔽了 SSE、WebSocket 等不同后端流的差异；前端编排层则通过 Hook/Context 管理上下文、工具调用和重试等交互逻辑。文章还介绍了工具调用（useAgentAction）、UI 交互、最小化接入代码示例，并展望了未来在知识库问答（RAG）和集成流程自动化方面的演进方向。

💡 主要观点

- VAPD AgentKit 采用三段式架构解耦 AI Agent 前端复杂性。 通过「统一消息模型」标准化数据、「Runtime Adapter」屏蔽后端协议差异、「前端编排」管理交互逻辑，实现了 UI 与后端的彻底解耦，使前端组件无需关心消息来源和传输协议。

Runtime Adapter 是实现协议无关性的核心。 只要后端能以流式输出事件（如 SSE、WebSocket、Fetch ReadableStream），Adapter 即可将其统一转换为标准的 AgentStreamEvent，前端逻辑无需任何改动，实现了后端协议的可插拔。

工具调用（Tool Calling）在前端通过 useAgentAction 实现声明式注册。 开发者可在任意组件中声明工具的名称、描述、参数和处理函数，其执行结果会自动回注为 ResultMessage，并支持幂等去重和自定义渲染卡片，实现了前端工具与 Agent 循环的无缝集成。

💬 文章金句

- 我们以「统一消息模型 + Runtime Adapter + 前端编排」的方式，将工具调用、Agent 回合循环、事件流与 UI 交互组合在一起。

后端返回的是「事件」，前端消费的是「消息」。我们把差异收敛在 Adapter 层。
UI 组件无须关心消息从哪里来，只负责渲染消息序列。
用「消息模型 + Runtime Adapter + 前端编排」的方式，我们把 Chat 模式做成了可以「拼」的底座。

📊 文章信息

AI 初评：86

来源：前端早读课

作者：前端早读课

分类：人工智能

语言：中文

阅读时间：13 分钟

字数：3080

标签： AI Agent, 前端架构, Chat 模式, Runtime Adapter, 工具调用

阅读完整文章

【第 3703 期】VAPD AgentKit：可组合 Agent 前端通用库实践

🤖 問 AI