Skip to main content
useStream 是与 UI 无关的。它返回包含消息、工具调用、加载标志和线程历史的纯响应式状态,您可以将其连接到您选择的任何视觉层。这些页面展示了不同的库如何与 LangChain 前端集成,每个库在构建 AI 聊天和生成式 UI 方面都有不同的理念。

集成

CopilotKit

具有结构化生成式 UI 支持的完整 AI 聊天运行时。向您的 LangGraph 部署添加自定义 CopilotKit 端点,然后在 React 中渲染动态组件树。

AI Elements

用于 AI 聊天的可组合 shadcn/ui 基础组件。直接插入 ConversationMessageToolReasoning 并将它们直接连接到 stream.messages

assistant-ui

具有完整运行时层的无头 React 框架。通过 useExternalStoreRuntime 适配器将 useStream 桥接到 AssistantRuntimeProvider

OpenUI

生成式 UI 库,允许代理以声明式组件 DSL 生成完整的交互式仪表板。专为数据丰富、报告式 UI 构建。

选择库

每个库都适合略有不同的集成模型。选择取决于您正在构建的 UI 类型:
CopilotKitAI Elementsassistant-uiOpenUI
最佳用途完整聊天运行时加上结构化生成式 UI具有丰富消息类型的聊天功能齐全且设置最少的聊天生成的仪表板和报告
UI 风格CopilotKit 聊天外壳 + 自定义消息渲染器可组合的 shadcn/ui 组件无头插槽 + 默认主题具有声明式 DSL 的预构建组件库
自定义自定义后端端点、代理上下文和渲染器直接编辑源文件覆盖组件插槽通过 CSS 自定义属性设置主题
流式 UX运行时管理的聊天流,具有结构化助手有效负载组件级渐进式渲染内置线程管理提升 — 外壳立即出现,数据填充
工具调用通过 CopilotKit 运行时和自定义渲染器Tool / ToolHeader / ToolOutput通过消息插槽自定义内联在生成的 UI 中
代理格式结构化助手响应加上可选的 Markdown任何 stream.messages任何 stream.messages代理输出 openui-lang 文本
所有四个库都能很好地与 LangChain 代理配合使用,后三个库还直接连接到 useStream。当您想要更丰富的运行时层和可以与 LangGraph 部署并存的专用端点时,CopilotKit 特别有用。