streaming-llm-responses

Stream LLM responses with lifecycle hooks and client tool events.

27|11|Updated Dec 21, 2025

Search Tags:#real-time #streaming #progress #ui-patterns #chatkit

Ready to run

npx skills add https://github.com/mjunaidca/mjs-agent-skills --skill streaming-llm-responses

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: streaming-llm-responses
Source: https://github.com/mjunaidca/mjs-agent-skills/tree/main/.claude/skills/streaming-llm-responses
Command: npx skills add https://github.com/mjunaidca/mjs-agent-skills --skill streaming-llm-responses

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Enables real-time, streaming UI experiences for AI chat, including response lifecycle, progress indicators, and client interactions.

Core Features & Use Cases

Response Lifecycle: manage onResponseStart and onResponseEnd to lock/unlock UI.
Client Effects: fire-and-forget UI updates via effects during streaming.
Progress Updates: show dynamic progress messages during long tasks.
Thread State: synchronize thread changes and UI state in real-time.

Quick Start

Integrate with a ChatKit-like client to stream responses and handle onEffect/onResponseStart events.

Frequently Asked Questions about streaming-llm-responses

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I implement real-time streaming responses in a chat UI?▼

Real-time streaming responses display LLM output as it's generated. Use lifecycle hooks like onResponseStart and onResponseEnd to manage UI state, onEffect for fire-and-forget updates during streaming, and ProgressUpdateEvent to show progress indicators. Integrate with a ChatKit-like client to emit server-to-client streaming events and render live feedback.

What lifecycle hooks do I need for streaming LLM chat applications?▼

Streaming chat requires onResponseStart to lock UI before generation begins, onResponseEnd to unlock after completion, onEffect for side effects during streaming, onThreadChange for state synchronization, and onClientTool for client-tool interactions. These hooks enable response lifecycle management and event-driven UI updates.

Can I show progress indicators during long LLM response generation?▼

Yes. Use ProgressUpdateEvent to emit dynamic progress messages during streaming. Combined with onEffect lifecycle hooks, you can display real-time progress updates, task status, and intermediate feedback as the LLM generates responses.

How do I synchronize thread state with UI updates in streaming chat?▼

Use onThreadChange hooks to detect thread updates and synchronize UI state in real-time. This ensures the chat interface reflects current thread context while responses stream, maintaining consistency across response lifecycle events and client interactions.

What's the difference between onEffect and onResponseStart for UI updates?▼

onResponseStart locks or unlocks UI at response boundaries, controlling when users can interact. onEffect fires fire-and-forget updates during streaming for intermediate feedback. Together they enable both lifecycle state management and continuous progress rendering.

Do I need client tool interactions for streaming LLM responses?▼

Client tool interactions through onClientTool are optional but enable advanced patterns like tool calling, form handling, and client-side effects during streaming. They integrate tool contracts into the response lifecycle for richer chat experiences.