0Pricing
JavaScript Academy · Урок

Обратное давление и передача потоков

Управляйте потоком с помощью pipeTo и pipeThrough.

«Обратное давление и передача потоков» — бесплатный урок JavaScript Academy на CoddyKit. Это урок 4 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения JavaScript Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс JavaScript Academy содержит 4 уроков всего.

Проблема обратного давления

Если производитель создаёт данные быстрее, чем потребитель успевает их обрабатывать, память заполняется. Обратное давление — это механизм, с помощью которого медленный потребитель сообщает быстрому производителю, что нужно замедлиться.

WritableStream

WritableStream — это назначение, в которое записываются фрагменты. Его метод-приёмник write(chunk) может быть асинхронным и сообщать о готовности принять следующий фрагмент.

const sink = new WritableStream({
  write(chunk) {
    console.log("writing", chunk);
  }
});

Получение объекта записи

getWriter() блокирует поток для записи и возвращает объект записи с методами write(), close() и обещанием ready.

const writer = sink.getWriter();
await writer.write("hello");
await writer.close();

Сигнал готовности

Дождитесь выполнения writer.ready перед записью. Обещание выполняется, когда поток может принять больше данных — это и есть обратное давление в действии.

await writer.ready;
await writer.write(chunk);

pipeTo

readable.pipeTo(writable) соединяет источник с назначением и автоматически управляет обратным давлением. Метод возвращает обещание, которое выполняется после завершения передачи данных.

await readableStream.pipeTo(writableStream);
console.log("done piping");

pipeThrough

pipeThrough(transform) вставляет преобразование между источником и приёмником и возвращает преобразованный доступный для чтения поток. Объедините несколько таких этапов, чтобы построить конвейер.

sourceStream
  .pipeThrough(new TextDecoderStream())
  .pipeThrough(parser)
  .pipeTo(consumer);

Верхние границы очереди

Параметр highWaterMark стратегии постановки в очередь задаёт, сколько фрагментов может находиться в очереди до включения обратного давления. Настройте его, чтобы сбалансировать пропускную способность и использование памяти.

new ReadableStream(source, new CountQueuingStrategy({ highWaterMark: 4 }));

desiredSize

Параметр desiredSize контроллера сообщает производителю, сколько места осталось в очереди. Когда его значение становится равным нулю или меньше нуля, прекратите добавлять фрагменты в очередь.

pull(controller) {
  while (controller.desiredSize > 0) {
    controller.enqueue(nextChunk());
  }
}

Прерывание передачи данных

Передайте { signal } в pipeTo, чтобы прервать весь конвейер с помощью AbortController.

const ctrl = new AbortController();
readable.pipeTo(writable, { signal: ctrl.signal });
ctrl.abort();

Параметры передачи данных

pipeTo принимает параметры preventClose, preventAbort и preventCancel, которые управляют распространением ошибок и завершения между концами потоков.

readable.pipeTo(writable, { preventClose: true });

Полный конвейер

Объединим всё: получим байты, декодируем, преобразуем и запишем их в приёмник — всё с автоматическим управлением потоком.

const res = await fetch("/data");
await res.body
  .pipeThrough(new TextDecoderStream())
  .pipeThrough(lineSplitter)
  .pipeTo(uiSink);

Быстрая проверка

Проверьте обратное давление.

Итоги: обратное давление и передача данных

Вы познакомились с WritableStream и объектами записи, дожидались ready для обработки обратного давления, соединяли потоки с помощью pipeTo/pipeThrough, настраивали highWaterMark, отслеживали desiredSize и прерывали конвейеры. На этом изучение Streams API завершено.

Часто задаваемые вопросы

Урок «Обратное давление и передача потоков» бесплатный?

Да — полный текст урока «Обратное давление и передача потоков» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс JavaScript Academy, подпишись на CoddyKit PRO. Курс JavaScript Academy содержит 4 уроков всего.

Чему я научусь в уроке «Обратное давление и передача потоков»?

Управляйте потоком с помощью pipeTo и pipeThrough. Ты практикуешь JavaScript Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать JavaScript Academy?

Предыдущий опыт не требуется. JavaScript Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 4 из 4.

Сколько времени занимает урок «Обратное давление и передача потоков»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке JavaScript Academy?

Да. Каждый урок JavaScript Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

  1. Потоки для чтения
  2. Потоковые ответы fetch
  3. Потоки преобразования
  4. Обратное давление и передача потоков
← Назад к JavaScript Academy