كيفية تجميع الموارد وتقليلها في ووردبريس

الحصول على أداء أفضل هو حلم كل من يدير موقعًا إلكترونيًا. يُعد تجميع الموارد وتقليصها على ووردبريس من أفضل الطرق لتحقيق ذلك، ولكنه قد يكون صعبًا للغاية. قد يؤدي تجميع جميع مواردك (وخصوصًا ملفات CSS وJS) إلى كشف موقعك الإلكتروني إذا لم تكن مطورًا، لأنه قد يُسبب تضاربًا.

WP Speed of Light الحل الأمثل لتحسين أداء موقع ووردبريس الخاص بك، إذ يوفر خيارات متعددة تُسهّل تحميل موقعك، بالإضافة إلى لوحة تحكم سهلة الاستخدام. ومن هذه الخيارات تجميع الموارد وتقليصها. يُعدّ إدراج/استبعاد ملف واحد من عملية التجميع والتقليص أمرًا أساسيًا لتحسين الأداء المخصص دون أي تعارضات.

سنستخدم موقع WordPress كمثال لهذه التدوينة وسنتعلم كيفية القيام بذلك حتى تكون عملية تكوين كل شيء أسهل.

كيفية تصغير حجم ملفات WordPress باستخدام JS و CSS

دعونا نتعلم كيفية القيام بتصغير wordpress js و CSS ولكن أولاً، نحتاج إلى معرفة ما يعنيه التصغير "يشير التصغير إلى عملية إزالة البيانات غير الضرورية أو المكررة دون التأثير على كيفية معالجة المورد بواسطة المتصفح - على سبيل المثال تعليقات الكود والتنسيق، وإزالة الكود غير المستخدم، واستخدام أسماء المتغيرات والوظائف الأقصر، وما إلى ذلك".

الآن ما سنفعله هو اختبار السرعة لصفحتنا من أجل رؤية التغييرات، في هذا المثال، نحن نستخدم موقعًا مع Woocommerce وبعض المنتجات، لذلك في المرة الأولى سيتم تحميله ببطء قليلاً.

نعم، يستغرق تحميل الصفحة ٢.٧٩ ثانية، وهو ليس سيئًا، ولكنه قد يكون أفضل. لنُصغّر حجم ملفات js وCSS ونرى الفرق. انتقل إلى WP Speed of light > SpeedUp > Group & Minify ، وستتمكن من رؤية القائمة التي تحتوي على جميع خيارات التصغير. يتضمن الإصدار المجاني من الإضافة خياري التجميع والتصغير، لكن ميزة استبعاد الملفات المرئية متاحة فقط في إصدار PRO Addon.

خيارات إضافة PRO هي: استبعاد النصوص البرمجية المضمنة (استبعاد النصوص البرمجية المضمنة من التصغير)، ونقل النصوص البرمجية إلى التذييل (يُمكّنك هذا من تسريع موقعك بنقل جميع النصوص البرمجية المُصغّرة إليه)، وتجميع الخطوط وخطوط جوجل (تجميع الخطوط المحلية وخطوط جوجل في ملف واحد لعرض أسرع)، واستبعاد الملفات المتقدم.
 
لديك خيار التصغير، كما ترى، JS وCSS وHTML، ما عليك سوى تفعيل هذه الخيارات، ثم النقر على "حفظ" وسيتم تصغير جميع مواردك على الفور. قد تواجه بعض المشاكل نظرًا لكونه إعدادًا متقدمًا، ولكن يُمكن إصلاح كل شيء باستبعاد بعض الأكواد والملفات (باستخدام الإضافة الاحترافية).

الآن يتم إنجاز جميع مهام المطور التي قد تستغرق ساعات في ثوانٍ معدودة.

الخطوة التالية، تحسين WordPress لـ CSS وJS

باستخدام هذا المكون الإضافي، سنسمح لبرنامج WordPress بتحسين CSS وjs فقط من خلال تمكين خيارات المجموعة على لوحة المعلومات، انتقل إلى WP Speed of Light > SpeedUp > Group & Minify ، وسوف تتمكن من رؤية لوحة معلومات تحتوي على خيارات تجميع CSS وjs.

تتيح لك هذه الخيارات:

• تجميع JS: تجميع العديد من ملفات Javascript في ملف واحد سيقلل من عدد طلبات HTTP
• تجميع CSS: تجميع العديد من ملفات CSS في ملف واحد سوف يقلل من عدد طلبات HTTP.

طلبات HTTP: هذه هي الطلبات التي يتم إرسالها إلى الخادم في كل مرة نختار فيها شيئًا أو ننتقل إلى صفحة أخرى في نفس الموقع، لذا إذا تمكنا من تقليل هذه الطلبات، فسوف يقل وقت التحميل.

لتحقق من عدد الملفات والبرامج النصية التي يمكنك تجميعها على موقع الويب الخاص بك، ما عليك سوى فتح وحدة التحكم في المتصفح (انقر بزر الماوس الأيمن > فحص أو F12) وافتح لوحة الشبكة .

يمكنك بعد ذلك إدراج جميع الملفات المحملة حسب النوع، هنا في هذا المثال قمت بالنقر فوق قائمة ملفات JS فقط.

الآن بعد أن وصلنا إلى هذه الإعدادات، فقط قم بتمكين خيارات المجموعة (مجموعة CSS والمجموعة JS) وانقر فوق حفظ، ضع في اعتبارك أن هذه الخيارات يجب استخدامها بحذر وسيتعين عليك اختبار صفحتك لأنها قد تسبب تعارضات.

دعونا نتعامل بجدية ونحسن وزن الخط

ماذا؟ تحسينات أخرى؟ نعم! ستتمكن من تحسين سمك الخط بسهولة من خلال تفعيل الخيار في الإعدادات، ما عليك سوى الانتقال إلى WP Speed of Light > SpeedUp > Group & Minify > Group fonts and Google Fonts .
يتيح لك خيار Group fonts and Google Fonts تجميعها في ملف واحد لعرضها بشكل أسرع، وهذا مفيد جدًا لأن معظم قوالب وتخطيطات ووردبريس تأتي مع خطين افتراضيًا مع جميع أنواع الخطوط (عادي، غامق، مائل...).

فقط قم بتمكين هذا الخيار، ثم انقر فوق حفظ وسيتم تجميع كافة الخطوط.

الآن بعد أن قمنا بتفعيل جميع الخيارات الخاصة بتصغير وتجميع الموارد، يجب أن نرى فرقًا في وقت تحميل موقعنا، دعنا نتحقق من السرعة.

يا له من فرق! من ٢.٨ ثانية إلى ٠.٥٦ ثانية! كما ذكرنا في بداية هذه التدوينة، يمكننا تحسين وقت التحميل ;)

كيفية استخدام استبعاد تصغير الملف

قد يُسبب التصغير مشاكل في موقعك، ويحدث ذلك غالبًا عند تجميع ملفات مُحددة تحتوي على خطأ في بناء الجملة أو مُتغير مُشابه أو اسم فئة. لذلك، باستخدام خيار "استبعاد تصغير الملفات"، يُمكنك استبعاد الملفات من عملية التصغير والتجميع. انتقل إلى WP Speed of Light > SpeedUp > Group & Minify ، وستجد استبعاد الملفات المُتقدم .

لكي تتمكن من استخدام استبعاد الملفات المتقدم، يجب عليك أولاً تشغيل فحص وتمكين الخيار والنقر فوق تشغيل الفحص.

 لكي تتمكن من إدراج النصوص البرمجية المُحمّلة على موقعك، WP Speed of Light فحص مجلدك لإدراجها. عادةً ما تكون جميعها موجودة في مجلد /wp-content الذي يضم جميع إضافاتك وقوالبك. حدد هذا المجلد (على الأقل) وانقر على "فحص الآن".

سيتم تشغيل الفحص، وأخيرًا، انقر فوق عرض النتائج عند اكتمال الفحص.

ستظهر أدناه قائمة بالملفات المصنفة حسب النوع (الكل، JS، CSS، الخط). إذا وجدت ملفًا واحدًا يسبب مشكلة، فيمكنك استبعاده من هنا عند تفعيل مجموعة الملفات والتصغير باستخدام مُبدّل تشغيل/إيقاف .

سيساعدك هذا على استبعاد الملفات، وبالتالي حل أي مشكلة قد تواجهها عند تصغير الموارد بسهولة. لا تزال عملية التجميع والتصغير تتطلب بعض الجهد، خاصةً أثناء الاختبار، لكنها تستحق العناء بالتأكيد، وستتمكن دائمًا من اختبار كيفية عملها من خلال تشغيل اختبار السرعة مباشرةً من WP Speed of Light .
 
جرّب WP Speed of Light : https://www.joomunited.com/wordpress-products/wp-speed-of-light