يمكن أن تؤدي لغة JavaScript غير المستخدمة إلى إبطاء سرعة تحميل الصفحة:
- إذا كانت لغة JavaScript تحظر العرض، يجب على المتصفّح تنزيل النص البرمجي وتحليله وتجميعه وتقييمه قبل أن يتمكّن من متابعة جميع الأعمال الأخرى المطلوبة لعرض الصفحة.
- وحتى إذا كانت لغة JavaScript غير متزامنة (لا تؤدي إلى حظر العرض)، يتنافس الرمز البرمجي على معدل نقل البيانات مع الموارد الأخرى أثناء عملية التنزيل، مما يكون لذلك آثار كبيرة على الأداء. يؤدي إرسال الرموز غير المستخدمة عبر الشبكة إلى إهدارها أيضًا لمستخدمي الهاتف المحمول الذين ليس لديهم خطط بيانات غير محدودة.
كيفية تعذُّر تدقيق JavaScript غير المستخدَم
تضع Lighthouse علامة على كل ملف JavaScript يحتوي على أكثر من 20 كيبيبايت من الرموز غير المستخدَمة:
كيفية إزالة محتوى JavaScript غير المستخدَم
رصد محتوى JavaScript غير المستخدَم
يمكن أن تقدّم لك علامة التبويب "التغطية" في "أدوات مطوري البرامج في Chrome" تحليلاً مفصّلاً للرموز غير المستخدَمة.
يمكن أن تساعدك الفئة Coverage
في Puppeteer في برمجة عملية
رصد الرموز غير المستخدَمة واستخراج الرموز المستخدَمة.
أداة تصميم لإتاحة إزالة الرموز غير المستخدَمة
أجرِ اختبارات Tooling.Report التالية لمعرفة ما إذا كانت أداة الحِزم متوافقة مع الميزات التي تسهّل تجنُّب الرموز غير المستخدَمة أو إزالتها:
إرشادات خاصة بحِزم البيانات
Angular
إذا كنت تستخدم Angular CLI، يُرجى تضمين خرائط المصدر في إصدار الإنتاج لفحص الحِزم.
Drupal
يمكنك إزالة أصول JavaScript غير المستخدمة وإرفاق مكتبات Drupal المطلوبة فقط بالصفحة ذات الصلة أو بالمكوِّن ذي الصلة في الصفحة. راجِع القسم تعريف مكتبة للحصول على التفاصيل.
Joomla
يمكنك تقليل عدد إضافات Joomla التي تُحمِّل JavaScript غير المستخدَم في صفحتك أو تبديلها.
Magento
أوقِف حزمة JavaScript المدمجة في Magento.
تفاعل
في حال عدم العرض من جهة الخادم، يمكنك تقسيم حِزم JavaScript باستخدام React.lazy()
.
بخلاف ذلك، يمكن تقسيم الرمز باستخدام مكتبة تابعة لجهة خارجية، مثل المكوّنات القابلة للتحميل.
فيو
في حال عدم استخدام العرض من جهة الخادم واستخدام جهاز توجيه Vue، يمكنك تقسيم الحزم حسب مسارات التحميل الكسول.
WordPress
يمكنك تقليل عدد مكوّنات WordPress الإضافية التي تُحمِّل لغة JavaScript غير المُستخدَمة في صفحتك أو تبديلها.