TransformStream נתמך עכשיו בדפדפנים שונים

עכשיו, אחרי שהטרנספורמציה של סטרימינג נתמכת ב-Chrome, ב-Safari וב-Firefox, הם מוכנים עכשיו לטרנדים בפריים.

תמיכה בדפדפן

  • Chrome: 67.
  • קצה: 79.
  • Firefox: 102.
  • Safari: 14.1.

מקור

ה-Streams API מאפשר להציג פירוט של המשאב שאתם רוצים לקבל, לשלוח או להפוך למקטעי נתונים קטנים, ולאחר מכן לעבד את המקטעים האלה בהדרגה. לאחרונה, Firefox 102 התחילו לתמוך ב-TransformStream, והמשמעות היא שעכשיו TransformStream בסופו של דבר ניתן לשימוש בכל הדפדפנים. טרנספורמציה של זרמים מאפשרת ReadableStream אל WritableStream, את המקטעים, או צורכת את התוצאה שעבר טרנספורמציה באופן ישיר, כפי שאפשר לראות בדוגמה הבאה.

class UpperCaseTransformStream {
  constructor() {
    return new TransformStream({
      transform(chunk, controller) {
        controller.enqueue(chunk.toUpperCase());
      },
    });
  }
}

button.addEventListener('click', async () => {
  const response = await fetch('/script.js');
  const readableStream = response.body
    .pipeThrough(new TextDecoderStream())
    .pipeThrough(new UpperCaseTransformStream());

  const reader = readableStream.getReader();
  pre.textContent = '';
  while (true) {
      const { done, value } = await reader.read();
      if (done) {
        break;
      }
      pre.textContent += value;
  }
});

הדגמה (דמו)