نصائح متقدمة لتحسين أداء موقع WordPress (بالفيديو)

آخر تحديث - 26 يوليو 2021

يتأثر أداء موقع الويب بقائمة طويلة من العوامل المباشرة وغير المباشرة. من أبعاد الصورة إلى إعدادات التخزين المؤقت ، يساهم كل عامل في تجربة المستخدم الأساسية.

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

في هذه المقالة ، ستتعرف على النصائح المتقدمة المتنوعة التي يمكنك اتباعها لتحسين أداء موقع WordPress على الويب.

أدوات لأداء موقع WordPress

عندما يرغب مالك أو مسؤول موقع الويب في إجراء تدقيق أداء لموقع WordPress على الويب ، فإن التحدي الأكبر هو اكتشاف المكان الذي يتخلف فيه النظام بأكمله. بعد كل شيء ، يمكن أن يستغرق استعراض كل مكون إضافي ، وموضوع ، وإعداد WordPress ، وجزء من التعليمات البرمجية باستخدام عدسة الأداء ، وقتًا طويلاً وغير فعال.

وعندما لا تعرف ما يجب إصلاحه ، فأنت لا تعرف كيفية إصلاحه.

ولهذا السبب يجب أن تفكر في استخدام أدوات عبر الإنترنت مثل PageSpeed ​​Insights و GTmetrix من Google لجمع بيانات موثوقة ومفيدة حول أداء موقع الويب الخاص بك. وإليك طريقة عملها:

1. باستخدام عنوان URL فقط ، تحلل هذه الأدوات جميع العوامل التي تساهم في أداء موقع الويب وتعيين درجة أو درجة.

2. تختبر هاتان الأداتان أداء موقع WordPress الخاص بك على 3 جوانب رئيسية (أو أساسيات الويب الأساسية):

• أكبر رسم محتوى - يقيس أداء التحميل بالإبلاغ عن وقت عرض أكبر صورة أو كتلة نصية مرئية داخل إطار العرض. يجب أن يحدث هذا بشكل مثالي خلال أول 2.5 ثانية.
• أول تأخير للإدخال - يقيس التفاعل عن طريق قياس الوقت بين تفاعل المستخدم الأول ومعالجة معالج الحدث الأول بالمتصفح. يجب أن يكون هذا المقياس مثاليًا أقل من 100 مللي ثانية.
• إزاحة التخطيط التراكمي - يقيس الثبات المرئي عن طريق حساب تغيرات التخطيط غير المتوقعة التي تحدث أثناء العمر الافتراضي للصفحة. يجب أن تسعى صفحتك للحصول على درجة CLS أقل من 0.1.

3. تتأثر عناصر الويب الحيوية الأساسية الثلاثة بشكل مباشر وغير مباشر بعدة عوامل. لذا تقترح الأداة أيضًا العوامل التي يمكنك التركيز عليها لتحسين أداء موقع الويب الخاص بك.

بالطبع ، تختلف هذه الاقتراحات من موقع إلى آخر. لكنك ستلاحظ دائمًا بعض العوامل التي تظهر بشكل متكرر والتي لها تأثير كبير على أداء موقع الويب. دعونا نلقي نظرة عليهم.

طلبات مفتاح التحميل المسبق

التحميل المسبق هو نظام يمنح متصفحات الويب تلميحات حول الموارد أو الملفات التي ستصبح ضرورية قريبًا لتحميل صفحة الويب. من خلال التحميل المسبق لطلبات المفاتيح ، يتم تنزيل هذه الملفات والموارد في وقت واحد أثناء قيام المستعرض بشيء آخر.

يتم ذلك عن طريق إضافة السمة rel = ”preload” إلى عناصر <link> في رأس الصفحة. تجعل المكونات الإضافية مثل تلميحات موارد الحفلة المسبقة من السهل تحميل طلبات المفاتيح مسبقًا.

في صفحة تقارير PageSpeed ​​Insights ، قم بتوسيع اقتراح "طلبات مفتاح التحميل المسبق". ثم انسخ الرابط إلى المورد المقدم.

بعد ذلك ، توجه إلى Pre * Party> Insert Hints في لوحة معلومات WordPress الخاصة بك. الصق الرابط المنسوخ في حقل عنوان URL ومكّن خيار "التحميل المسبق". بعد ذلك ، انقر فوق "إدراج تلميح مورد".

كرر العملية لجميع الموارد التي ظهرت في تقرير PageSpeed ​​Insights.

تحسين JavaScript و CSS

تشكل JavaScript و CSS جزءًا مهمًا من بنية صفحة الويب. بقدر ما يطلب منهم عرض صفحة ويب ، يمكنهم أيضًا المساهمة في إبطائها. لذلك ، من المهم أن تقوم بتحسين استخدامها قدر الإمكان.

سترى بشكل عام اقتراحات تحسين JavaScript و CSS الأربعة التالية في PageSpeed ​​Insights:

• إزالة JavaScript غير المستخدمة - قم بإزالة JavaScript غير المستخدمة لتقليل وحدات البايت التي يستهلكها نشاط الشبكة.
• إزالة CSS غير المستخدمة - قم بإزالة القواعد الميتة من أوراق الأنماط وتأجيل تحميل CSS غير المستخدم لمحتوى الجزء المرئي من الصفحة لتقليل وحدات البايت غير الضرورية التي يستهلكها نشاط الشبكة.
• تصغير JavaScript - يمكن أن يؤدي تصغير ملفات JavaScript إلى تقليل أحجام الحمولة الصافية ووقت تحليل البرنامج النصي.
• تصغير CSS - يمكن أن يؤدي تصغير ملفات CSS إلى تقليل أحجام حمولة الشبكة.
• تخلص من موارد حظر العرض - تمنع الموارد أول رسم لصفحتك. ضع في اعتبارك تقديم JS / CSS مضمنة وتأجيل جميع أنماط JS / الأنماط غير الهامة.

يمكنك معالجة هذه المشكلات باستخدام المكون الإضافي Asset Cleanup بسهولة. بعد تثبيته ، توجه إلى Asset Cleanup> CSS / JS Manager. هنا ، يمكنك اختيار إزالة ملفات CSS و JavaScript معينة من صفحة معينة أو من موقع الويب بأكمله. يتيح لك المكون الإضافي تحسين البرامج النصية من السمات الفردية والمكونات الإضافية ونواة WordPress ومصادر الجهات الخارجية.

في قسم "الإعدادات" ، ستجد المزيد من الخيارات لتقليل CSS وجافا سكريبت. بالإضافة إلى ذلك ، يمكنك فقط التمرير لأسفل لتمكين الخيارات المضمنة والمؤجلة ، والتي تساعد في التخلص من موارد حظر العرض.

تقليل وقت استجابة الخادم الأولي

عندما يتوجه المستخدمون إلى عنوان URL في متصفحهم ، يتم إرسال طلب شبكة من المتصفح لجلب هذا المحتوى. يتلقى الخادم الخاص بك الطلب ويعيد محتوى الصفحة.

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

تقترح PageSpeed ​​Insights ما يلي:

• استخدام سمات محسّنة مثل Astra و GeneratePress.
• استخدام المكونات الإضافية المحسنة مثل W3 Total Cache.
• ترقية الخادم الخاص بك.

تحسين الصورة

تساهم الصور في أكثر من نصف وزن الصفحة لمتوسط ​​وزن صفحة WordPress. علاوة على ذلك ، يمكن لمئات الصور غير المحسّنة المنتشرة عبر المنشورات والصفحات أن تبطئ موقع الويب الخاص بك حقًا.

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

يمكنك استخدام بعض تقنيات تحسين الصورة كما هو موضح أدناه:

• ضغط الصور - قم بتقليل حجم الملف دون التأثير على الجودة عن طريق إزالة المعلومات غير الضرورية مثل تفاصيل الكاميرا والبيانات الوصفية.
• تغيير حجم الصور - قم بتقليل دقة الصورة إلى ما هو مطلوب على صفحة الويب.
• Image CDN - خدمة الصور بشكل أسرع عن طريق سد الفجوة بين المستخدم والخادم.
• تنسيقات الصور المثلى - اختر PNG للحصول على خلفية شفافة والتعتيم والشعارات والرموز. استخدم JPEG لكل شيء آخر.

يمكنك قراءة مقالة تحسين الصورة المتعمقة الخاصة بنا حول هذا الموضوع لمزيد من المعلومات.

متصفح التخزين المؤقت

يمكن أن يساعد التخزين المؤقت للمستعرض في تقليل تحميل الخادم عن طريق تقليل عدد الطلبات لكل صفحة. لذا لا يلزم تنزيل الموارد القابلة للتخزين المؤقت مثل الصور و CSS و JavaScript وغيرها في كل مرة. يمكنك استخدام مكون إضافي للتخزين المؤقت للمتصفح مثل W3 Total Cache للاستفادة من التخزين المؤقت للمتصفح على موقع WordPress الخاص بك.

بعد تثبيت البرنامج المساعد ، توجه إلى صفحة الإعدادات الخاصة به. هنا ، تحتاج إلى تمكين خيار Browser Cache. بعد ذلك ، توجه إلى إعدادات ذاكرة التخزين المؤقت للمتصفح من الشريط الجانبي. وتأكد من تمكين رأس انتهاء الصلاحية وعنوان التحكم في ذاكرة التخزين المؤقت وتعيين خيارات العلامة الإلكترونية.

احفظ الإعدادات إذا أجريت أي تغييرات.

تحقق من مقالتنا حول التخزين المؤقت لمتصفح WordPress لمعرفة المزيد حول هذا الموضوع.

استنتاج

بصرف النظر عن ذلك ، قد يحتوي تقرير PageSpeed ​​Insights لموقع الويب الخاص بك على العديد من الاقتراحات الأخرى للتحسينات. ومع ذلك ، يمكنك ببساطة توسيع الاقتراحات في صفحة التقرير لمعرفة المزيد حول تنفيذها. إذا كانت لا تزال لديك أسئلة ، فلا تتردد في التواصل معنا في التعليقات أدناه.

إذا كنت تفضل إصدار فيديو ، فيرجى مشاهدة الفيديو أدناه:

قراءة متعمقة:

• 5 خطوات بسيطة لتسريع موقع WooCommerce الخاص بك اليوم (بالفيديو)
• أفضل خدمات CDN المجانية لتحسين أداء الموقع
• كيفية بناء موقع WordPress في 7 خطوات سهلة
• كيفية استخدام GTmetrix؟