تقسيم الشيفرة والاستيرادات الديناميكية
قسّم الحزمة تلقائيًا حسب المسار واستخدم import() الديناميكي لتحميل الأجزاء عند الطلب.
تقسيم الشيفرة والاستيرادات الديناميكية درس مجاني في Sveltejs Academy على CoddyKit. هذا هو الدرس 1 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Sveltejs Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
التقسيم التلقائي
يقسّم SvelteKit الحزم تلقائيًا لكل مسار. ولا ينزّل الزوار سوى JavaScript الخاص بالمسارات التي يزورونها.
الاستيراد الديناميكي
للحصول على تقسيم أكثر دقة، استخدموا import() الديناميكي لتحميل الوحدات عند الطلب.
const Heavy = (await import("./Heavy.svelte")).default;التحميل المشروط
حمّلوا مكتبة كبيرة فقط عندما يتطلبها إجراء محدد من المستخدم.
async function openEditor() {
const { default: Editor } = await import("./Editor.svelte");
// ...
}تسمية الأجزاء
يسمّي Vite الأجزاء بذكاء. ويمكنكم إضافة تلميحات باستخدام تعليقات على نمط webpackChunkName عند الحاجة.
التحميل المسبق
استخدموا data-sveltekit-preload-code لتحميل كود المسار مسبقًا عند تمرير المؤشر فوقه.
حجم الحزمة
تعني الحزم الأولية الأصغر تحميل الصفحات بسرعة أكبر وتحسين مؤشرات Core Web Vitals.
إزالة الشجرة
يزيل SvelteKit، عبر Vite/Rollup، التصديرات غير المستخدمة تلقائيًا باستخدام تقنية إزالة الشجرة.
المكوّنات الكسولة
غلّفوا الاستيرادات الديناميكية داخل مكوّنات تُعرض بعد اكتمال تحميلها.
المشكلات المحتملة
تضيف الاستيرادات الديناميكية حدودًا غير متزامنة. تعاملوا مع حالات التحميل بسلاسة.
تحليل الحزمة
استخدموا أدوات تصور الحزم لتحديد ما ينبغي تقسيمه لاحقًا.
متى لا ينبغي التقسيم
بالنسبة إلى الوحدات الصغيرة جدًا، تكون تكلفة التقسيم أكبر من فائدته. أجروا تحليلًا للأداء لتحديد مستوى التفصيل المناسب.
تحقق سريع
كيف يقسّم SvelteKit الحزم افتراضيًا؟
مراجعة
يُجري SvelteKit تقسيم الكود تلقائيًا لكل مسار. استخدموا import() الديناميكي للتحميل الكسول بدرجة أدق.
تعلم HTML مع معلم ذكاء اصطناعي — مجانًا
اكتب وقم بتشغيل أكوادك الفعلية في المتصفح، واحصل على مساعدة فورية من معلم ذكاء اصطناعي متاح 24/7، واستمر من حيث توقفت على الويب أو في التطبيق.
- الدورات
- 41
- الدروس
- 163
الأسئلة الشائعة
هل درس «تقسيم الشيفرة والاستيرادات الديناميكية» مجاني؟
نعم — نص درس «تقسيم الشيفرة والاستيرادات الديناميكية» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Sveltejs Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
ماذا ستتعلم في «تقسيم الشيفرة والاستيرادات الديناميكية»؟
قسّم الحزمة تلقائيًا حسب المسار واستخدم import() الديناميكي لتحميل الأجزاء عند الطلب. تتمرن على Sveltejs Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ Sveltejs Academy؟
لا تُشترط خبرة سابقة. Sveltejs Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 1 من أصل 4.
كم من الوقت يستغرق درس «تقسيم الشيفرة والاستيرادات الديناميكية»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس Sveltejs Academy هذا؟
نعم. كل درس في Sveltejs Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- تقسيم الشيفرة والاستيرادات الديناميكية
- تحسين الصور باستخدام @sveltejs/enhanced-img
- التحميل الكسول للمكوّنات
- تحليل أداء تطبيقات SvelteKit