Поток чтения: метод tee()

Метод tee() интерфейса ReadableStream расщепляет текущий поток чтения, возвращая массив из двух элементов, содержащих две ветви результата в виде новых экземпляров ReadableStream.

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

Ветвление потока будет частично сигнализировать о недостатке ресурсов со скоростью более быстрого потребителя из двух ReadableStream ветвей, а необработанные данные добавляются в очередь внутри более медленного потребителя ReadableStream без каких-либо ограничений или недостатка ресурсов. То есть, когда у обеих ветвей есть непрочитанный элемент в их внутренней очереди, тогда внутренняя очередь контроллера исходного ReadableStream начнёт заполняться, и как только её desiredSize ≤ 0 или контроллер потока байтов desiredSize ≤ 0, контроллер прекратит вызывать pull(controller) на базовом источнике, переданном в ReadableStream(). Если потребляется только одна ветвь, всё содержимое будет добавлено в память. Поэтому не следует использовать встроенный tee() для одновременного чтения очень больших потоков с разной скоростью. Вместо этого следует искать реализацию, которая полностью учитывает ограничение ресурсов, соответствующее скорости более медленной ветви потребления.

Чтобы отменить поток, вам нужно отменить обе полученные ветви. Расщепление потока обычно блокирует его на всё время существования, предотвращая блокировку другими читателями.

Нет.

Массив Array , содержащий два экземпляра ReadableStream.

TypeError

Выбрасывается, если исходный поток не является потоком ReadableStream.

В следующем простом примере ранее созданный поток разделяется, а затем оба полученных потока (содержащиеся в двух членах сгенерированного массива) передаются функции, которая считывает данные из двух потоков и последовательно выводит фрагменты каждого потока в разные части пользовательского интерфейса. Полный код см. в примере простого разделения потока.

function teeStream() {
  const teedOff = stream.tee();
  fetchStream(teedOff[0], list2);
  fetchStream(teedOff[1], list3);
}

function fetchStream(stream, list) {
  const reader = stream.getReader();
  let charsReceived = 0;

  // read() returns a promise that resolves
  // when a value has been received
  reader.read().then(function processText({ done, value }) {
    // Result objects contain two properties:
    // done  - true if the stream has already given you all its data.
    // value - some data. Always undefined when done is true.
    if (done) {
      console.log("Stream complete");
      return;
    }

    // value for fetch streams is a Uint8Array
    charsReceived += value.length;
    const chunk = value;
    let listItem = document.createElement("li");
    listItem.textContent = `Read ${charsReceived} characters so far. Current chunk = ${chunk}`;
    list.appendChild(listItem);

    // Read some more, and call this function again
    return reader.read().then(processText);
  });
}

• ReadableStream() конструктор
• Ветвление потока