home / skills / andrelandgraf / fullstackrecipes / resumable-ai-streams

resumable-ai-streams skill

safe

This skill enables automatic recovery for AI chat response streams using WorkflowChatTransport, start/resume endpoints, and useResumableChat hook to maintain

npx playbooks add skill andrelandgraf/fullstackrecipes --skill resumable-ai-streams

Review the files below or copy the command above to add this skill to your agents.

Files (1)

SKILL.md

543 B

---
name: resumable-ai-streams
description: Add automatic stream recovery to AI chat with WorkflowChatTransport, start/resume API endpoints, and the useResumableChat hook.
---

# Resumable AI Response Streams

To set up Resumable AI Response Streams, refer to the fullstackrecipes MCP server resource:

**Resource URI:** `recipe://fullstackrecipes.com/resumable-ai-streams`

If the MCP server is not configured, fetch the recipe directly:

```bash
curl -H "Accept: text/plain" https://fullstackrecipes.com/api/recipes/resumable-ai-streams
```

Overview

This skill adds automatic stream recovery to AI chat flows using WorkflowChatTransport, start/resume API endpoints, and a useResumableChat hook. It provides a production-ready pattern and step-by-step guide for building resilient, resumable AI response streams in TypeScript full-stack apps. The goal is to make streamed responses recoverable after network interruptions with minimal client changes.

How this skill works

The system wraps the chat transport with WorkflowChatTransport to track stream state and checkpoints. Server endpoints expose start and resume operations so the client can request continued streaming from the last known checkpoint. On the client, useResumableChat manages local state, reconnection logic, and replaying or resuming partial responses automatically. Together these pieces let the app continue an interrupted response stream without re-running the entire generation.

When to use it

Building chat or assistant UIs that rely on streamed model outputs and need reliability.
Supporting flaky mobile or low-bandwidth networks where interruptions are common.
Reducing compute and cost by resuming long-running generations instead of restarting.
Implementing server-authoritative recovery and audit trails for conversational state.
Deploying production AI features where UX expectations require seamless recovery.

Best practices

Track lightweight checkpoints frequently to minimize re-generation on resume.
Keep resume tokens short-lived and rotate them for security and abuse control.
Design the resume API to be idempotent so repeated resume calls are safe.
Expose clear client-side signals (loading, resumed, failed) so UI can react.
Log stream lifecycle events for observability and postmortem debugging.

Example use cases

A chat assistant on mobile that transparently resumes responses after signal loss.
A long-form content generation tool that continues a partially streamed draft.
Customer support bots that maintain transcript continuity across reconnects.
Multi-step workflows where each step’s output is streamed and must be recoverable.
Internal tooling that replays partial streams for auditing and QA.

FAQ

Does resuming require re-running the whole generation?

No. Checkpointing and server-side resume logic continue from the last committed state to avoid re-running previously generated tokens.

Is the hook framework-specific?

The provided useResumableChat hook is TypeScript-focused and integrates easily with common React stacks, but the recovery pattern can be adapted to other front-end frameworks.