الترطيب التدريجي
رطّب أجزاء الصفحة التي تحتاج إلى التفاعلية فقط لتسريع TTI.
الترطيب التدريجي درس مجاني في Sveltejs Academy على CoddyKit. هذا هو الدرس 4 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Sveltejs Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
ما المقصود بـ Hydration
الترطيب هو عملية إرفاق سلوك JavaScript بـ HTML المُصيَّر من الخادم داخل المتصفح.
لماذا الترطيب التدريجي
يستهلك الترطيب الكامل للصفحات الكبيرة قدرًا كبيرًا من وحدة المعالجة المركزية. ويعطي الترطيب التدريجي الأولوية للتفاعلية المهمة أولًا.
الإعدادات الافتراضية في SvelteKit
يُجري SvelteKit الترطيب لكل صفحة، وليس لكل مكوّن. وتُرطَّب المسارات بشكل مستقل عند الحاجة.
بنية الجزر
ادمجوا التصيير المسبق الثابت مع الترطيب الانتقائي للمكوّنات التفاعلية فقط.
المكوّنات الكسولة
استخدموا import() الديناميكي للمكوّنات غير المهمة لتأجيل تحميلها.
const Comments = await import("./Comments.svelte");مراقب التقاطع
رطّبوا عناصر واجهة المستخدم الموجودة أسفل الجزء الظاهر عند ظهورها أثناء التمرير.
استخدام Actions
غلّفوا التحميل الكسول داخل Svelte action لإتاحة إعادة استخدامه.
مكاسب الأداء
زمن أقل حتى التفاعل TTI، وحمولة JavaScript أولية أصغر، وتفاعلية أولية أسرع.
المفاضلات
قد يؤخر الترطيب المؤجل التفاعلية في الأجزاء المؤجلة. خططوا لذلك بعناية.
SSR والترطيب
يوفّر SSR الرسم الأولي، ثم يضيف الترطيب سلوك JavaScript فوقه.
مقارنة أطر العمل
شاعرت Astro وQwik أسلوبي الجزر والقابلية للاستئناف، بينما يوفّر SvelteKit أدوات مشابهة يدويًا.
تحقق سريع
ما المقصود بالترطيب التدريجي؟
مراجعة
أجّلوا ترطيب المكوّنات غير المهمة باستخدام الاستيرادات الديناميكية ومراقبي التقاطع لتقليل زمن الوصول إلى التفاعل TTI.
الأسئلة الشائعة
هل درس «الترطيب التدريجي» مجاني؟
نعم — نص درس «الترطيب التدريجي» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Sveltejs Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
ماذا ستتعلم في «الترطيب التدريجي»؟
رطّب أجزاء الصفحة التي تحتاج إلى التفاعلية فقط لتسريع TTI. تتمرن على Sveltejs Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ Sveltejs Academy؟
لا تُشترط خبرة سابقة. Sveltejs Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 4 من أصل 4.
كم من الوقت يستغرق درس «الترطيب التدريجي»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس Sveltejs Academy هذا؟
نعم. كل درس في Sveltejs Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- بث البيانات باستخدام Promises في load
- التحميل المؤجل وتجربة مستخدم شبيهة بـ Suspense
- البث من الخادم باستخدام +server.js
- الترطيب التدريجي