Design an Embeddable Streaming Chat Interface
GoogleFrontend Engineer · OnsiteLast updated
Design an embeddable chat-agent widget with resumable streaming, virtualized history, safe caching, accessibility, and meaningful metrics.
Design an Embeddable Streaming Chat Interface
Design an embeddable chat-agent widget. Cover the host-page integration, streaming responses over SSE or gRPC, long-conversation virtualization, chat-history caching, and core product and reliability metrics.
Constraints & Assumptions
- The widget may run inside a host application with its own authentication and styles.
- Assistant output arrives incrementally and may fail or be cancelled.
- Long histories cannot all remain mounted in the browser.
Clarifying Questions to Ask
- Is the widget an iframe, web component, or library integrated into the host DOM?
- Must conversations synchronize across devices?
- Which guarantees apply to message ordering and resuming a broken stream?
Hints
Hint 1
Define message states: Represent pending, streaming, complete, failed, retried, and cancelled messages explicitly before choosing UI components.
Follow-up questions
- How would tool-call approval appear without allowing duplicate actions?
- How would you avoid losing partially streamed content during navigation?
Solution walkthrough is for members
Get the full walkthrough with reference code and complexity analysis, plus Kitty Coach at 300 messages a day. Hints, the code runner and community answers stay free.