Strumieniowanie za pomocą ReadableStream
Stopniowo przesyłaj duże odpowiedzi za pomocą Web Streams API w +server.js.
Strumieniowanie za pomocą ReadableStream to bezpłatna lekcja Sveltejs Academy na CoddyKit. To lekcja 4 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej Sveltejs Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs Sveltejs Academy zawiera 4 lekcji w sumie.
Dlaczego strumieniować
Duże odpowiedzi można wysyłać stopniowo, aby klient od razu zaczął otrzymywać dane.
ReadableStream API
Użyj standardowego interfejsu Web Streams API, aby zbudować odpowiedź strumieniowaną.
const stream = new ReadableStream({
async start(controller) {
for (const chunk of source) {
controller.enqueue(new TextEncoder().encode(chunk));
}
controller.close();
}
});
return new Response(stream);Zdarzenia wysyłane przez serwer
Strumieniuj dane text/event-stream, aby dostarczać aktualizacje w czasie rzeczywistym.
Transfer porcjowany
HTTP przesyła każdą umieszczoną w kolejce porcję przez sieć, gdy tylko jest gotowa.
Przypadki użycia
Logi w czasie rzeczywistym, generowanie tekstu przez AI, przesyłanie i pobieranie plików, zdarzenia postępu.
Po stronie klienta
Po stronie klienta należy użyć response.body.getReader(), aby odczytywać strumień.
Backpressure
Strumień wstrzymuje generowanie danych, gdy odbiorca działa wolno. Należy unikać blokowania producenta.
Zamykanie
Po zakończeniu należy zawsze wywołać controller.close(). W przypadku błędów należy wywołać controller.error().
Adaptery
Obsługa streamingu różni się w zależności od adaptera. adapter-node działa, ale niektóre środowiska edge mają ograniczenia.
Wydajność
Streaming znacznie skraca czas do pierwszego bajtu i wyraźnie poprawia odczuwaną szybkość działania.
Połącz z load
Streaming w SvelteKit zwraca obiekty Promises, które są rozwiązywane z czasem, i różni się od surowych strumieni.
Szybkie sprawdzenie
Jaka jest główna korzyść ze streamingu?
Podsumowanie
Owiń ReadableStream w obiekt Response, aby przesyłać fragmenty progresywnie z +server.js.
Ucz się HTML dzięki korepetycjom AI — za darmo
Pisz i uruchamiaj kod w przeglądarce, otrzymuj natychmiastową pomoc od korepetytora AI dostępnego 24/7 i kontynuuj naukę w sieci lub w aplikacji.
- Kursy
- 41
- Lekcje
- 163
Często zadawane pytania
Czy lekcja „Strumieniowanie za pomocą ReadableStream” jest bezpłatna?
Tak — pełny tekst „Strumieniowanie za pomocą ReadableStream” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu Sveltejs Academy, przejdź na CoddyKit PRO. Kurs Sveltejs Academy zawiera 4 lekcji w sumie.
Co nauczysz się w „Strumieniowanie za pomocą ReadableStream”?
Stopniowo przesyłaj duże odpowiedzi za pomocą Web Streams API w +server.js. Ćwiczysz Sveltejs Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.
Czy potrzebuję doświadczenia, aby zacząć Sveltejs Academy?
Nie wymagamy żadnego doświadczenia. Sveltejs Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 4 z 4.
Ile czasu zajmuje lekcja „Strumieniowanie za pomocą ReadableStream”?
Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.
Czy mogę pisać i uruchamiać kod w tej lekcji Sveltejs Academy?
Tak. Każda lekcja Sveltejs Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.
Wszystkie lekcje w tym kursie
- +server.js: GET POST PUT DELETE
- Request i RequestEvent
- Zwracanie odpowiedzi JSON
- Strumieniowanie za pomocą ReadableStream