streaming

name	streaming
description	HTTP streaming patterns including React Suspense streaming SSR, ReadableStream API, Server-Sent Events, chunked transfer encoding, and AI response streaming with Vercel AI SDK
layer	utility
category	backend
triggers	["streaming","stream response","ReadableStream","chunked transfer","streaming SSR","AI streaming","Vercel AI SDK","stream text","server-sent events"]
inputs	["Streaming use case (AI chat, SSR, data feed, file download)","Runtime environment (Node.js, Edge, Cloudflare Workers)","Client framework (React, vanilla JS)"]
outputs	["Streaming endpoint implementation","Client-side stream consumer code","Error handling and backpressure patterns"]
linksTo	["nextjs","nodejs","websockets","react"]
linkedFrom	["api-designer","performance-profiler"]
preferredNextSkills	["nextjs","caching"]
fallbackSkills	["websockets","nodejs"]
riskLevel	low
memoryReadPolicy	selective
memoryWritePolicy	none
sideEffects	[]

HTTP Streaming Skill

Purpose

Stream data to clients as it becomes available instead of buffering the full response. Essential for AI chat interfaces, large data exports, real-time SSR, and progressive loading patterns.

When to Use What

Pattern	Use Case	Latency	Complexity
ReadableStream	Custom binary/text streaming	Low	Medium
Streaming SSR	React Suspense + App Router	Low TTFB	Low (built-in)
AI SDK streaming	LLM chat responses	Token-level	Low
Chunked transfer	Large file/data export	Progressive	Low
SSE	Server push notifications	Real-time	Low

Key Patterns

1. ReadableStream API (Web Standard)

// Works in Next.js Edge, Cloudflare Workers, Deno, Bun
export async function GET() {
  const encoder = new TextEncoder();

  const stream = new ReadableStream({
    async start(controller) {
      const items = await db.query('SELECT * FROM large_table');

      for (const item of items) {
        controller.enqueue(encoder.encode(JSON.stringify(item) + ));
        
          ( (r, ));
      }

      controller.();
    },
    () {
      
      .();
    },
  });

    (stream, {
    : {
      : ,
      : ,
    },
  });
}