تخطَّ إلى المحتوى

Streaming

الدرس 42 من 55

الهدف

بعد هالدرس تقدر تبني streaming chat UI — backend يرسل الـ tokens وهي تتولد، والـ frontend يعرضها على طول.

ليش هذا الحين؟

API keys و token counting جاهزين. الحين أقوى تحسين لتجربة المستخدم: بدل ما ينتظر 5 ثواني وبعدين يشوف كل شي، يشوف الكلمات تجي وحدة وحدة.

الفكرة

Non-streaming vs Streaming:

Non-streaming:
  User waits 5s ───────────────────► [FULL RESPONSE APPEARS]

Streaming:
  User waits 0.5s ► [word] ► [word] ► [word] ► [word] ► [done]

التقنية:

Backend:  Server-Sent Events (SSE) أو ReadableStream
Frontend: fetch() + ReadableStream reader + TextDecoder

محتاج مساعدة؟ راسلنا على mj@shakesbeard.net