JavaScript Academy · Pelajaran

Tekanan Balik dan Piping

Kelola kendali aliran dengan pipeTo dan pipeThrough.

Pelajaran 4 dari 413 langkah

Tekanan Balik dan Piping adalah pelajaran JavaScript Academy gratis di CoddyKit. Ini adalah pelajaran 4 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar JavaScript Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus JavaScript Academy mencakup 4 pelajaran total.

Masalah Tekanan Balik

Jika produsen menghasilkan data lebih cepat daripada yang dapat ditangani konsumen, memori akan penuh. Tekanan balik adalah mekanisme yang digunakan konsumen lambat untuk memberi tahu produsen cepat agar memperlambat laju.

WritableStream

WritableStream adalah tujuan tempat Anda menulis potongan. Metode tujuan write(chunk) mungkin bersifat asinkron dan menandakan kesiapan untuk menerima potongan berikutnya.

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

Mendapatkan Penulis

getWriter() mengunci aliran yang dapat ditulis dan mengembalikan penulis dengan write(), close(), serta promise ready.

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

Sinyal ready

Tunggulah writer.ready sebelum menulis. Sinyal ini selesai ketika aliran dapat menerima lebih banyak data — inilah tekanan balik yang sedang bekerja.

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

pipeTo

readable.pipeTo(writable) menghubungkan sumber ke tujuan dan secara otomatis mengelola tekanan balik untuk Anda. Fungsi ini mengembalikan promise yang selesai ketika pengaliran berakhir.

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

pipeThrough

pipeThrough(transform) menyisipkan transformasi antara sumber dan tujuan, lalu mengembalikan aliran baca yang telah ditransformasi. Rangkai beberapa transformasi untuk membangun alur.

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

Batas highWaterMark

highWaterMark pada strategi antrean menetapkan jumlah potongan yang boleh mengantre sebelum tekanan balik mulai bekerja. Sesuaikan nilainya untuk menyeimbangkan laju pemrosesan dan penggunaan memori.

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

desiredSize

desiredSize milik pengendali memberi tahu produsen berapa banyak ruang yang tersisa dalam antrean. Jika nilainya mencapai nol atau kurang, hentikan pemasukan data ke antrean.

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

Membatalkan Pengaliran

Berikan { signal } kepada pipeTo untuk membatalkan seluruh alur dengan AbortController.

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

Opsi Pengaliran

pipeTo menerima preventClose, preventAbort, dan preventCancel untuk mengatur cara kesalahan dan penyelesaian diteruskan di antara kedua ujung.

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

Alur Lengkap

Jika digabungkan: ambil byte, dekode, transformasikan, lalu tulis ke tujuan — semuanya dengan pengendalian aliran otomatis.

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

Uji Cepat

Uji tekanan balik.

Rangkuman: Tekanan Balik dan Pengaliran

Anda mengenal WritableStream dan penulis, menunggu ready untuk menangani tekanan balik, menghubungkan aliran dengan pipeTo/pipeThrough, menyesuaikan highWaterMark dan memantau desiredSize, serta membatalkan alur. Dengan demikian, API Streams selesai dipelajari.

Gratis untuk memulai

Belajar JavaScript dengan tutor AI — gratis

Tulis dan jalankan kode asli di browser kamu, dapatkan bantuan instan dari tutor AI 24/7, dan lanjutkan di mana kamu tinggalkan di web atau aplikasi.

Kursus
59
Pelajaran
200

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Tekanan Balik dan Piping” gratis?

Ya — teks lengkap “Tekanan Balik dan Piping” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus JavaScript Academy, upgrade ke CoddyKit PRO. Kursus JavaScript Academy mencakup 4 pelajaran total.

Apa yang akan aku pelajari di “Tekanan Balik dan Piping”?

Kelola kendali aliran dengan pipeTo dan pipeThrough. Kamu berlatih JavaScript Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai JavaScript Academy?

Tidak diperlukan pengalaman sebelumnya. JavaScript Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 4 dari 4.

Berapa lama pelajaran “Tekanan Balik dan Piping” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran JavaScript Academy ini?

Ya. Setiap pelajaran JavaScript Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

  1. Stream yang Dapat Dibaca
  2. Respons fetch Streaming
  3. Stream Transformasi
  4. Tekanan Balik dan Piping
← Kembali ke JavaScript Academy