概述
将 useStream 连接到任何 React UI 组件库或生成式 UI 框架
useStream 与 UI 无关。它返回包含消息、工具调用、加载标志、值以及线程元数据的纯响应式状态，你可以将其连接到所选的任何视觉层。这些页面展示了不同的库如何与 LangChain 前端集成，每个库在构建 AI 聊天和生成式 UI 方面都具有不同的理念。
集成
具有结构化生成式 UI 支持的完整 AI 聊天运行时。为你的 LangGraph 部署添加自定义 CopilotKit 端点，然后在 React 中渲染动态组件树。
基于 shadcn/ui 的可组合 AI 聊天组件。直接引入
Conversation、Message、Tool和Reasoning，并将它们直接连接到stream.messages。
拥有完整运行时层的无头（Headless）React 框架。通过
useExternalStoreRuntime适配器将useStream桥接到AssistantRuntimeProvider。
生成式 UI 库，允许 Agent 在声明式组件 DSL 中生成完整且可交互的仪表盘。专为数据丰富、报告风格的 UI 打造。
选择库
每个库都适合略微不同的集成模式。选择取决于你正在构建什么样的 UI：
| CopilotKit | AI Elements | assistant-ui | OpenUI | |
|---|---|---|---|---|
| 最适合 | 完整聊天运行时加结构化生成式 UI | 具有丰富消息类型的聊天 | 具有极简配置的全功能聊天 | 生成的仪表盘和报告 |
| UI 风格 | CopilotKit 聊天外壳 + 自定义消息渲染器 | 可组合的 shadcn/ui 组件 | 无头插槽 + 默认主题 | 带有声明式 DSL 的预置组件库 |
| 定制性 | 自定义后端端点、Agent 上下文和渲染器 | 直接编辑源文件 | 覆盖组件插槽 | 通过 CSS 自定义属性设置主题 |
| 流式体验 | 带有结构化 Assistant 负载的运行时管理聊天流 | 组件级渐进式渲染 | 内置线程管理 | 提升（Hoisting）：外壳立即出现，数据随后填入 |
| 工具调用 | 通过 CopilotKit 运行时和自定义渲染器 | Tool / ToolHeader / ToolOutput | 通过消息插槽自定义 | 内联在生成的 UI 中 |
| Agent 格式 | 结构化 Assistant 响应加可选 Markdown | 任意 stream.messages | 任意 stream.messages | Agent 输出 openui-lang 文本 |
这四者均能与 LangChain Agent 良好协作，而后三者还可以直接连接到 useStream。当你需要更丰富的运行时层以及可以与 LangGraph 部署并存的专用端点时，CopilotKit 特别有用。