Потоковая передача с сервера через +server.js
Постепенно отправляйте фрагменты из маршрута API с помощью ReadableStream.
«Потоковая передача с сервера через +server.js» — бесплатный урок Sveltejs Academy на CoddyKit. Это урок 3 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Sveltejs Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Sveltejs Academy содержит 4 уроков всего.
Потоки, отправляемые сервером
Внутри +server.js возвращайте Response, оборачивающий ReadableStream.
Базовый поток
Создайте поток, который со временем выдаёт фрагменты данных.
export function GET() {
const stream = new ReadableStream({
async start(controller) {
for (const chunk of source) {
controller.enqueue(new TextEncoder().encode(chunk));
}
controller.close();
}
});
return new Response(stream);
}Тип содержимого
Укажите подходящий тип содержимого: text/plain, text/event-stream, application/json (NDJSON) и другие.
Варианты использования
Генерация текста с помощью ИИ, журналы в реальном времени, загрузка больших файлов, постепенное обновление данных.
Обратное давление
Поток замедляет создание данных, когда потребитель работает медленно, предотвращая чрезмерный рост потребления памяти.
Получение данных на клиенте
Используйте response.body.getReader() на клиенте, чтобы читать поток.
События, отправляемые сервером
Для односторонней передачи данных от сервера к клиенту отлично подходят SSE. Кодируйте события как text/event-stream.
Альтернатива WebSockets
Для двустороннего обмена выберите WebSockets через отдельный сервер или адаптер, который их поддерживает.
Отмена
Обрабатывайте отмену потока в функции запуска, чтобы освобождать ресурсы.
Поддержка адаптеров
Большинство адаптеров поддерживают потоковую передачу; сведения о пограничных случаях ищите в документации своего адаптера.
Производительность
Потоковая передача сокращает TTFB и позволяет клиентам раньше обрабатывать частичные данные.
Быстрая проверка
Какой класс потока используется в +server.js?
Повторение
Используйте ReadableStream в +server.js для передачи фрагментов данных с малой задержкой от сервера.
Изучай HTML с ИИ-репетитором — бесплатно
Пиши и запускай код прямо в браузере, получай мгновенную помощь от ИИ-репетитора 24/7 и продолжи учиться на сайте или в приложении.
- Курсы
- 41
- Уроки
- 163
Часто задаваемые вопросы
Урок «Потоковая передача с сервера через +server.js» бесплатный?
Да — полный текст урока «Потоковая передача с сервера через +server.js» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Sveltejs Academy, подпишись на CoddyKit PRO. Курс Sveltejs Academy содержит 4 уроков всего.
Чему я научусь в уроке «Потоковая передача с сервера через +server.js»?
Постепенно отправляйте фрагменты из маршрута API с помощью ReadableStream. Ты практикуешь Sveltejs Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать Sveltejs Academy?
Предыдущий опыт не требуется. Sveltejs Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 3 из 4.
Сколько времени занимает урок «Потоковая передача с сервера через +server.js»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке Sveltejs Academy?
Да. Каждый урок Sveltejs Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- Потоковая передача данных с промисами в load
- Отложенная загрузка и интерфейс по типу Suspense
- Потоковая передача с сервера через +server.js
- Постепенная гидратация