micsapp Openrouter Streaming Setup
Overview
This skill demonstrates streaming response implementation for lower perceived latency and real-time output display.
Prerequisites
- OpenRouter integration
- Frontend capable of handling SSE/streaming
Instructions
- Enable streaming: Set
stream: truein your chat completion request body - Handle SSE chunks: Parse each
data: {...}line from the response stream, extractingchoices[0].delta.contentfrom each chunk - Detect stream end: Watch for
data: [DONE]to know when the stream is complete; accumulate chunks for the full response - Implement frontend rendering: Use
ReadableStreamorEventSourcein the browser to display tokens as they arrive - Add error recovery: Handle mid-stream disconnections with automatic retry and partial response preservation
Output
- Real-time token-by-token text output in the UI
- Reduced time-to-first-token compared to non-streaming requests
- Complete response assembled from all chunks with usage stats from the final chunk
Error Handling
| Error | Cause | Fix |
|---|---|---|
| Stream cuts off mid-response | Network timeout or model error | Implement reconnection logic; save partial output |
Missing usage in stream |
Some models omit usage in streaming mode | Set stream_options: { include_usage: true } or make a separate token count call |
| Empty delta chunks | Keep-alive pings from the server | Filter chunks where delta.content is null or empty |
See ${CLAUDE_SKILL_DIR}/references/errors.md for full error reference.
Examples
See ${CLAUDE_SKILL_DIR}/references/examples.md for runnable code samples.