vercel · Vercel AI SDK Docs
AI SDK UI: Reading UIMessage Streams
Implements a pattern for reading and processing incoming message streams from the AI SDK UI to update the user interface in real-time.
Derived skill
Files assembled from official documentation
Viewing SKILL.md
AI SDK UI: Reading UIMessage Streams
Implements a pattern for reading and processing incoming message streams from the AI SDK UI to update the user interface in real-time.
When To Use
Use when you need to implement real-time UI updates that react to streaming text or data chunks from an AI model response.
Reference Files
| File | Contains | Use For |
|---|---|---|
SKILL.md | Entry point: scope, routing table, and workflow. | Start here. |
docs/ai-sdk-ui-reading-uimessage-streams-workflow-guide.md | Documentation explaining how to consume and process UIMessage streams for custom client-side implementations and terminal UIs. | Questions about documentation explaining how to consume and process UIMessage streams for custom client-side implementations and term... |
examples/ai-sdk-ui-reading-uimessage-streams-ai-sdk-ui-readuimessagestream-typesc.text | A TypeScript code example demonstrating how to iterate over a UIMessage stream using the readUIMessageStream function from the AI SDK. | Exact payloads, commands, or snippets shown in A TypeScript code example demonstrating how to iterate over a UIMessage stream using the readUIMessageStream function... |
examples/ai-sdk-ui-reading-uimessage-streams-ai-sdk-ui-readuimessagestream-typesc-2.text | A TypeScript code example demonstrating how to use the readUIMessageStream function with streamText and tool calls. | Exact payloads, commands, or snippets shown in A TypeScript code example demonstrating how to use the readUIMessageStream function with streamText and tool calls. |
examples/ai-sdk-ui-reading-uimessage-streams-ai-sdk-ui-readuimessagestream-typesc-3.text | A TypeScript code example demonstrating how to use readUIMessageStream to resume a conversation from a previous UIMessage. | Exact payloads, commands, or snippets shown in A TypeScript code example demonstrating how to use readUIMessageStream to resume a conversation from a previous UIMes... |
What This Skill Covers
- UIMessage streams are useful outside of traditional chat use cases. You can consume them for terminal UIs, custom stream processing on the client, or React S...
- Main sections:
Basic Usage,Tool Calls Integration,Resuming Conversations.
Workflow
- Open the most relevant file under
docs/for the exact documented workflow and wording. - Open
schemas/files for exact structured contracts. - Open
examples/files for concrete requests, commands, snippets, and manifests. - Do not add behavior or configuration that is not present in the attached source files.
Canonical source: https://ai-sdk.dev/docs/ai-sdk-ui/reading-ui-message-streams