Skip to content

useStream 与界面(UI)无关。它返回包含消息、工具调用、加载标志、值以及线程元数据的纯响应式状态,你可以将其连接到所选定的任意可视化层。这些页面展示不同库如何与 LangChain 前端集成,每个库在构建 AI 聊天和生成式 UI 时都采用不同的理念。

集成

  • CopilotKit — 支持结构化生成式 UI 的完整 AI 聊天运行时。将自定义 CopilotKit 端点添加到你的 LangGraph 部署中,然后在 React 中渲染动态组件树。
  • AI Elements — 用于 AI 聊天的、可组合的基于 shadcn/ui 的组件。直接放入 ConversationMessageToolReasoning,并将它们直接连接到 stream.messages
  • assistant-ui — 带有完整运行时层的无头(Headless)React 框架。通过 useExternalStoreRuntime 适配器将 useStream 桥接到 AssistantRuntimeProvider
  • OpenUI — 生成式 UI 库,让智能体能够以声明式组件 DSL 生成完整、可交互的仪表盘。专为数据密集型、报告风格的 UI 而设计。

选择库

每个库都适配略有不同的集成模型。选择取决于你正在构建的 UI 类型:

CopilotKitAI Elementsassistant-uiOpenUI
最适合完整聊天运行时加结构化生成式 UI带丰富消息类型的聊天以最少配置实现功能完备的聊天生成的仪表盘和报告
UI 风格CopilotKit 聊天外壳加自定义消息渲染器可组合的 shadcn/ui 组件无头插槽加默认主题带声明式 DSL 的预构建组件库
自定义自定义后端端点、智能体上下文和渲染器直接编辑源文件覆盖组件插槽通过 CSS 自定义属性设置主题
流式输出体验运行时管理的聊天流,带结构化助手负载组件级渐进式渲染内置线程管理提升式(hoisting)——外壳立即出现,数据随后填充
工具调用通过 CopilotKit 运行时和自定义渲染器Tool / ToolHeader / ToolOutput通过消息插槽自定义内联在生成的 UI 中
智能体格式结构化助手响应加可选 Markdown任意 stream.messages任意 stream.messages智能体输出 openui-lang 文本

这四个库都能与 LangChain 智能体很好地配合,其中后三个还可以直接连接到 useStream。当你需要更丰富的运行时层以及一个可以与 LangGraph 部署并存的专用端点时,CopilotKit 尤其有用。