0Pricing
Sveltejs Academy · درس

بث البيانات باستخدام Promises في load

أعد Promises غير محلولة من load لبث البيانات بعد HTML الأولي.

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

لماذا البث

يتيح تحميل البيانات بالبث تصيير الصفحة قبل اكتمال البيانات البطيئة، مما يحسّن الأداء المتصوَّر.

إعادة الوعود

أعيدوا البيانات مع جعل بعض خصائصها وعودًا لم تُحل بعد.

export async function load() {
  return {
    fast: getFastData(),
    slow: getSlowData()   // promise, not awaited
  };
}

استخدام await في الترميز

استخدموا {#await} في الصفحة لمعالجة الوعد المُرسل بالبث.

{#await data.slow}
  <p>Loading...</p>
{:then result}
  <p>{result}</p>
{/await}

HTML الأولي

تُصيَّر البيانات السريعة فورًا، ثم تُضاف البيانات البطيئة عند اكتمالها.

تجربة استخدام شبيهة بـ Suspense

اعرضوا هياكل عظمية أو مؤشرات تحميل أثناء وصول البيانات بالبث.

خصائص متعددة مُرسلة بالبث

أرسلوا عدة خصائص بالبث بشكل مستقل، بحيث تُحل كل منها وفق جدولها الزمني الخاص.

الأخطاء في عمليات البث

استخدموا {:catch} في كتلة await لمعالجة حالات الرفض.

يتطلب الخادم

لا يعمل تحميل البيانات بالبث إلا عند تفعيل SSR.

لا توجد قيود على Adapter

تدعم معظم Adapters، مثل node وvercel وcloudflare، البث.

أمان الأنواع

يضمن إرجاع قيم من النوع Promise<T> دقة الأنواع في خاصية data.

متى يُستخدم

واجهات API البطيئة، والمحتوى المُنشأ بالذكاء الاصطناعي، والاستعلامات الكبيرة؛ أي شيء لا ينبغي أن يحجب الرسم الأول.

تحقق سريع

ماذا يحدث عند إعادة وعد غير منتظر من load؟

مراجعة

أرسلوا البيانات بالبث عبر إعادة وعود لم تُحل بعد من load، ثم عالجوها في الترميز باستخدام {#await}.

الأسئلة الشائعة

هل درس «بث البيانات باستخدام Promises في load» مجاني؟

نعم — نص درس «بث البيانات باستخدام Promises في load» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Sveltejs Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.

ماذا ستتعلم في «بث البيانات باستخدام Promises في load»؟

أعد Promises غير محلولة من load لبث البيانات بعد HTML الأولي. تتمرن على Sveltejs Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ Sveltejs Academy؟

لا تُشترط خبرة سابقة. Sveltejs Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 1 من أصل 4.

كم من الوقت يستغرق درس «بث البيانات باستخدام Promises في load»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس Sveltejs Academy هذا؟

نعم. كل درس في Sveltejs Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

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

  1. بث البيانات باستخدام Promises في load
  2. التحميل المؤجل وتجربة مستخدم شبيهة بـ Suspense
  3. البث من الخادم باستخدام +server.js
  4. الترطيب التدريجي
← العودة إلى Sveltejs Academy