使用 SSE 应对 AI 延迟
我开发了一个 AI 自动补全功能。用户非常讨厌它。
用户的每一次按键都会向 AI 模型发送一个请求。用户需要等待 2 到 3 秒才能得到完整响应。UI 体验非常糟糕。
我尝试过防抖 (debouncing)、缓存 (caching) 和加载动画 (loading spinners)。但都没用。核心问题依然存在：用户必须等待整个答案生成完毕后才能看到任何数据。
我通过使用 Server-Sent Events (SSE) 来逐块流式传输响应，解决了这个问题。
原有的缓慢流程：
- 用户输入字符
- 300ms 防抖
- HTTP POST 请求
- 服务器调用 AI API（1-2 秒）
- 服务器返回完整响应
- 客户端渲染
用户在 2 秒钟内什么也看不到。
我考虑过轮询 (polling)，但它会带来过高的开销。WebSocket 虽然可行，但对于单向流来说太重了。
我选择了 SSE。它是一种标准，服务器通过一个长连接发送文本事件。
为什么 SSE 适用于 AI：
- 它是单向的（从服务器到客户端）
- 它使用基于文本的 JSON 数据块
- 它能自动处理重连
- 你不需要额外的库
效果立竿见影。第一个词在 300 毫秒内就出现了。用户可以看到建议逐字生成。
我的指标提升了：
- 首次视觉响应时间：从 2.1s 降至 0.3s
- 用户参与度：提升 40%
- 用户投诉：零
流式传输关乎感知。一个缓慢但渐进的 UI 优于一个快速但静态的 UI。相比于等待一大块文本出现，用户更喜欢看到答案逐字显现。
如果你的 AI 功能感觉反应迟钝，请先尝试流式传输。
可选学习社区: https://t.me/GyaanSetuAi