JavaScript Academy · درس

الضغط العكسي وتمرير التدفقات

أديروا التحكم في التدفق باستخدام pipeTo وpipeThrough.

الضغط العكسي وتمرير التدفقات درس مجاني في JavaScript Academy على CoddyKit. هذا هو الدرس 4 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في JavaScript Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة JavaScript Academy 4 دروس في المجموع.

مشكلة الضغط العكسي

إذا أنشأ المُنتِج بيانات أسرع مما يستطيع المستهلك معالجته، تمتلئ الذاكرة. الضغط العكسي هو الآلية التي يُخبر بها المستهلك البطيء المُنتِج السريع بأن يبطئ.

WritableStream

يمثّل WritableStream وجهةً تكتب فيها الأجزاء. وقد تكون طريقة sink الخاصة به، write(chunk)، غير متزامنة، ما يشير إلى جاهزيته لاستقبال الجزء التالي.

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

الحصول على Writer

تعمل getWriter() على قفل التدفق القابل للكتابة، وتعيد writer يوفّر write() وclose() ووعد ready.

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

إشارة ready

انتظروا 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 يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

← العودة إلى JavaScript Academy