خطوات تسريع ووردبريس على جوجل PageSpeed Insights إلى 100%

يعد إجراء اختبارات السرعة باستخدام أدوات مثل Google PageSpeed Insights أو Gtmetrix أو WebPageTest طريقة جيدة دائمًا للمساعدة في قياس أداء موقع الويب الخاص بك. في حين أن هذه المقاييس يمكن أن تكون مفيدة للغاية، فمن المهم أيضًا إبقاء هذه البيانات في نصابها الصحيح. بينما يمكنهم توفير معلومات قيمة للمساعدة في تسريع ووردبريس، لا تنسَ الأداء الملحوظ، وتحديداً تجربة المستخدم ومؤشرات أداء الويب.

قد يكون العثور على هذا التوازن المثالي بين تجربة المستخدم والحصول على 100% في Google PageSpeed Insights أمرًا صعبًا للغاية.

ستكون معادلة كل موقع مختلفة - لا يوجد نهج واحد يناسب الجميع.

مع ما يقال، انظر كيف استطعنا بسهولة تسريع ووردبريس والحصول على 100% في Google PageSpeed Insights.

لماذا نهتم بتسريع ووردبريس؟

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

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

يتطرق نفس الدليل أيضًا إلى التفاصيل المتعلقة بسرعة الصفحة ووزن الصفحة بالإضافة إلى رؤى إضافية حول نيتش معين، مثل السيارات والتكنولوجيا وتجارة التجزئة. وفقًا لـ Google ، فإن أفضل سرعة لموقع الويب هو جعله أقل من 3 ثوانٍ من وقت التحميل. كما نرى من الرسم البياني أدناه، فإن هذه الممارسات بعيدة جداً عن الوفاء بها للمواقع الموجودة في الولايات المتحدة.

كيف تؤثر سرعة الصفحة على الأرباح

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

لهذا السبب، أنشأت Google أداة حاسبة لأرباح الأداء والتي تقدر مقدار الإيرادات الإضافية التي يمكن أن تحققها إذا كان موقعك أسرع. خذ المثال أدناه على سبيل المثال. الموقع الذي يتم تحميله في 3 ثانية ، لديه 100,000 زائر شهريًا، ولديه متوسط قيمة مبيعة يبلغ 25$ ويبلغ معدل التحويل 2%. إذا قام مالك الموقع بتحسين سرعة ذلك الموقع بمقدار 1.5 ثانية فقط، فمن المحتمل أن يزيد من أرباحه السنوية بحوالي $41,090.

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

ومع ذلك، لا تبني جهودك فقط على مقاييس جوجل PageSpeed Insights. هدفك هنا ليس تسجيل 100% فقط من أجل الحصول على 100%، فالهدف هو تحسين الأداء العام لموقعك. وتذكر أن درجات أدوات السرعة ليست مهمة في كثير من الاحيان.

خطوات الحصول على 100% في Google PageSpeed Insights

عندما يتعلق الأمر بمحاولة تسريع ووردبريس ، فقد يكون الأمر صعبًا في بعض الأحيان. نعلم جميعًا أن ووردبريس ليس أسرع نظام أساسي موجود، خاصةً من وجهة نظر المطورين. الطريقة التي يتم بها وضع السكربتات وتشغيل الإضافات التابعة لجهات خارجية يمكن أن تجعل هذا نوعًا ما كابوسًا. ولكن في النقيب للمعلوماتية، لا يوجد لدينا ما هو مستحيل! وجميع المواقع التي نقوم بتصميمها تحطم أرقاماً قياسية في السرعة. تمكنا بسهولة من الحصول على 100% في Google PageSpeed Insights. يتضمن ذلك 100% سرعة و 100% درجة تجربة المستخدم على الهاتف المحمول بالإضافة إلى سطح المكتب 100%.

إليك ما فعلناه لتسريع موقع ووردبربيس الخاص بنا والحصول على 100% في Google PageSpeed Insights

1. إستخدام DNS مميز

نحن نستخدم كلاود فلير ولكن لا نستخدم أيًا من تحسينات سرعته (DNS only).

لأننا نستخدم CDN من BunnyCDN فوجدنا في اختباراتنا أن إستخدام كلاود فلير مع Bunny كان أبطأ.

إذا كنت في بيئة استضافة مشتركة، فمن المحتمل أن تساعدك كلاود فلير كثيرًا.

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

2. إستخدم أسرع استضافة ووردبريس

تساعد الإستضافة السريعة بشكل كبير على تسريع ووردبريس بشكل عام، من خلال تحسين وقت استجابة الخادم (TTFB) وتحسين مؤشرات أداء الويب (LCP و FID). معظم توصيات الاستضافة هي بصراحة هراء.

انضم إلى مجموعة WordPress Hosting على فيسبوك للحصول على تعليقات غير متحيزة من الأشخاص المطلعين الذين كانوا حول المجموعة. لن أخبرك بتبديل الإستضافة إذا لم تكن بحاجة إلى ذلك، لذا قم بفحص موقعك من خلال Lighthouse وتحقق من أوقات استجابة الخادم البطيئة (TTFB) التي تزيد عن 600ms.

ألق نظرة على المحادثات ونتائج الترحيل واستطلاعات الرأي المنشورة في بعض مجموعات فيسبوك هذه. أنت تعرف بالفعل أن العلامات التجارية GoDaddy و EIG (Bluehost و HostGator) ليست جيدة. تؤثر الاستضافة على TTFB و LCP ومؤشرات أداء الويب الأخرى والتي أصبحت عامل تصنيف في جوجل.

Cloudways هي الجهة التي يستخدمها معظم الأشخاص في مجموعة فيسبوك تلك (بما فيهم أنا). على وجه التحديد خطة DigitalOcean أو Vultr HF. إنها تتراوح بين 10$ و 13$ شهريًا، لكننا نتحدث عن السرعة هنا، وليس الرخص.

هنا الكثير من الأشخاص انتقلوا إلى Cloudways ونشروا نتائجهم

استطلاعات الرأي الأخيرة التي تم إجراؤها على فيسبوك حول "أفضل استضافة"

أنا أستخدم Cloudways DigitalOcean الذي احتل المرتبة الأولى في أحدث استطلاعات الرأي على فيسبوك.

لا نقول أن الاستضافة هي كل شيء، لكنها تساعد.

أنا أستخدم Cloudways لأن:

• وقت TTFB الخاص بي دائماً أقل من 200ms.
• حتى المقالات التي يبلغ حجم صفحة 1.6mb يمكن تحميلها في أقل من ثانيتين
• إنها توفر ترحيلًا مجانيًا ولكن اضافة Migrator الخاصة بهم ستفي بالغرض أيضًا.
• يقومون باستمرار بتحديث تقنية السرعة الخاصة بهم.
• مستويات مختلفة من الكاش Varnish و Redis و memcached كلها مدمجة للحصول على أداء أعلى.
• الدعم رائع كما ينعكس في مراجعات Trustpilot الخاصة بهم.
• SSL ، Staging ، والحماية من الروبوتات الضارة والنسخ الاحتياطية كلها سهلة للغاية في لوحة معلومات Cloudways.
• لديهم مجموعة فيسبوك لمستخدمي Cloudways لطرح الأسئلة.
• يمكنك الاختيار من DigitalOcean و Vultr HF و Linode و AWS و Google Cloud.
• إن إضافة خادم وترحيل موقعك ولوحة التحكم في الواقع أمر سهل للغاية.
• تعد DigitalOcean و Vultr HF أسرع بكثير من الاستضافة المشتركة.

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

3. أعد التفكير في قالبك + مُنشئ الصفحة

معظم الناس يستخدمون قالب Astra، هذا لأنه مشهور جداً وقالب قديم.

المشكلة الوحيدة في Astra هي أن معظم مواقع Starter الخاصة به تستخدم أدوات إنشاء الصفحات. يضيف Elementor الكثير من البرامج النصية التي يمكن أن تبطئ بشكل معتدل موقع ووردبريس الخاص بك (يمكنك التحقق منها في Clearfy أو Perfmatters).

فيما يلي ملفات CSS و JavaScript الإضافية التي أضافها Elementor:

أوصي إما GeneratePress أو Oxygen Builder (هو ما أستخدمه).

4. تحسين مؤشرات أداء الويب

يخبرك PageSpeed Insights ما إذا كان موقع ووردبريس الخاص بك يعاني من 3 مؤشرات ويب أساسية:

سرعة عرض أكبر جزء من المحتوى على الصفحة (LCP)

LCP هو أكبر جزء من المحتوى على الصفحة.

عادةً ما يكون العنصر الأكبر صورة أو صورة خلفية أو علامة H1، ولكن يمكن أن يكون أيًا من العناصر التالية:

• صورة
• الصورة الخلفية
• فيديو أو رسوم متحركة
• عنصر على مستوى العرض

يمكن رؤية أكبر جزء من المحتوى على الصفحة لديك في تقرير PageSpeed Insights الخاص بك. في هذه الحالة بالذات، يعد عنصر LCP صورة خلفية تظهر عبر موقع الويب بالكامل.

تحسين LCP

• قم بتحميل صورة LCP مسبقًا (Preload)
• ضغط صورة LCP (جرب 85%)
• عرض صورة LCP من CDN الخاص بك
• تقليل حجم صورة LCP باستخدام WebP أو SVG
• استبعد صورة LCP (والصور الأخرى في الجزء المرئي) من التحميل البطيء
• تخلص من موارد حظر العرض باستخدام WP Rocket + Async JavaScript
• تقليل TTFB (توقف عن الاستضافة المشتركة وجرب مزود استضافة سحابي أسرع)
• تجنب تحميل JavaScript ثقيل تابع لجهة خارجية (مثل الإعلانات) في الجزء المرئي من الصفحة
• قم بتأخير JavaScript باستخدام Flying Scripts أو "تأخير تنفيذ JavaScript" في WP Rocket
• تحسين الخطوط (استضافتها محليًا، التحميل المسبق، استخدام خطوط النضام)
• الاتصال المسبق بشبكات CDN وخطوط الجهات الخارجية إذا كنت تستخدمها (على سبيل المثال //fonts.gstatic.com)

متغيرات التصميم التراكمية (CLS)

يعني CLS أن العناصر الموجودة على موقع الويب الخاص بك تتغير.

يمكنك العثور عليها في Layout Shift Debugger من Google.

كما يتم عرضها أيضًا في تقرير بيانات تشخيص PageSpeed Insights ضمن "تجنب متغيرات التصميم الكبيرة". عند عرض التقرير، سترى العناصر التي لها أعلى مساهمة في CLS.

تحسين CLS

• حدد أبعاد الصور ومقاطع الفيديو وإطارات iframes
• حدد أبعاد الإعلانات الشائعة في div
• حاول تجنب عرض الإعلانات في الجزء المرئي
• استضف الخطوط محليًا على الخادم الخاص بك واختبر تحميلها مسبقًا
• تجنب تنسيق خط TTF (غالبًا ما يكون أبطأ بكثير من WOFF أو WOFF2)
• تأكد من أن تحسين تسليم CSS يعمل كما ينبغي (على سبيل المثال في WP Rocket) لتجنب FOUC
• قم بتأجيل جافا سكريبت لمنع المحتوى الجديد ما لم يتم تشغيله عن طريق تفاعل المستخدم

تأخير الإدخال الأولي (FID)

FID هو الوقت الذي يبدأ فيه تفاعل المستخدم مع الصفحة (أي النقر فوق ارتباط أو زر) إلى الوقت الذي تستجيب فيه الصفحة بالفعل. هذا لا يشمل التمرير أو التكبير. يتطلب FID مستخدمًا حقيقيًا ولا يمكن قياسه في المختبر، لذلك تقترح Google استخدام وقت الحظر الإجمالي (TBT) بدلاً من ذلك.

تحسين FID و TBT

• تأجيل وتأخير وتقليل JavaScript
• استخدم ضغط GZIP أو Brotli (يفضل Brotli وهو أسرع)
• أصلح أخطاء 4xx و 5xx في مخطط شلال GTmetrix الخاص بك
• قم بإزالة JavaScript غير المستخدمة باستخدام Clearfy أو Perfmatters
• قم بإزالة أدوات إنشاء الصفحات الثقيلة التي تضيف الكثير من CSS/JS الإضافية
• حاول استخدام الإضافات الخالية من jQuery وتجنب الإضافات ذات التحميل البطيء
• تقليل تأثير رمز الطرف الثالث (الخطوط ، التحليلات ، GTM ، الإعلانات ، مقاطع الفيديو)
• قم بتحسين الصور والرسوم المتحركة خاصةً إذا كانت تتسبب في مهام سلسلة رئيسية طويلة

لقد قمت بنشر فيديو حول حل مشاكل مؤشرات أداء الويب أو الصفحات البطيئة في مشرفي مواقع جوجل. فعلاً يستحق المتابعة:

5. تكوين إضافة كاش جيدة

WP Rocket و LiteSpeed هما المعياران الذهبيان لإضافات ذاكرة التخزين المؤقت.

ومع ذلك ، لا يقوم معظم الأشخاص بتهيئة هذه الإعدادات بالإعدادات المثلى. لقد كتبت دروسًا تعليمية شائعة حول تكوين WP Rocket و Swift Performance (فيديو) و WP Fastest Cache (فيديو) و W3 Total Cache و WP Super Cache (فيديو).

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

• تنظيف قاعدة البيانات (مضمن في WP Rocket، أو استخدم WP-Optimize)
• تحسين CSS/JS - أو Autoptimize
• تأخير تنفيذ JavaScript - أو Flying Scripts
• التحميل المسبق/الصفحة الفورية - Perfmatters أو Flying Pages
• التحكم في Heartbeat (مضمن في WP Rocket، أو استخدم Heartbeat control)
• التحميل الكسول للصور/الفيديو (مدمج في WP Rocket، أو استخدام WP YouTube Lyte)
•  استضافة Google Analytics محليًا (مضمّن في WP Rocket، أو استخدام Flying Analytics)
• الجلب المسبق/التحميل المسبق - Pre* Party Resource Hints
• التوافق مع Cloudflare أو اي شبكة CDN أخرى (مضمنة في WP Rocket، أو استخدام CDN Enabler)

أنا أستخدم WP Rocket الذي حصل على التقييم #1 في العديد من إستطلاعات الرأي على فيسبوك.

6. تحسين الصور

الصور هي المساهم الرئيسي في زيادة حجم صفحة ويب معينة. الحيلة هي تقليل حجم الصور دون المساومة على الجودة.

هناك عدة طرق لتحسين الصور. تخبرنا Google PageSpeed Insights أننا بحاجة إلى تحسين صورنا. تضهر مشاكل الصور في أداة جوجل PageSpeed Insights من خلال التوصيات ادناه:

• الصور ذات الحجم المناسب - قم بتغيير حجم الصور الكبيرة لتصبح أصغر.
• تأجيل الصور خارج الشاشة - يؤخر تحميل الصور حتى يتم رؤيتها بوضوح.
• ترميز الصور بكفاءة عالية - استخدم مكونًا إضافيًا لتحسين الصورة لضغط الصور.
• عرض الصور بتنسيقات الجيل القادم - استخدم تنسيق WebP / SVG بدلاً من JPEG / PNG.
• تحديد أبعاد الصور - أضف عرض/ارتفاع إلى HTML للصورة.

الصور ذات الحجم المناسب - قم بتغيير حجم الصور الكبيرة لتصبح أصغر. لا تستخدم أبدًا ميزة "السحب لتغيير الحجم" في المحرر المرئي نظرًا لأن هذا يؤدي فقط إلى تغيير حجم الصورة المعروضة (وليس الصورة الفعلية). من الأفضل تغيير الحجم إلى الأبعاد الصحيحة قبل تحميلها.

عرض الصور بتنسيقات الجيل القادم - تحتوي معظم اضافات تحسين الصور على خيار تحويل الصور إلى تنسيق WebP ، أنصح بإضافة Imagify لتحسين الصور وتحويل صيغغتها إلى WebP.

ترميز الصور بكفاءة عالية - هذا يعني ضغط الصور وإختيار الصيغة الجيدة. لحسن الحظ، تتوفر مكونات إضافية لكل ما يمكنك التفكير فيه، بما في ذلك تحسين صور ووردبريس. من الجدير بالذكر:

• Imagify
• WP Smush
• EWWW Image Optimizer

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

تأجيل الصور خارج الشاشة - إن عملية ضغط الصور وتصحيح أبعادها ليس كل شيء! من الجيد تفعيل ميزة التحميل الكسول للصور كذلك. يمكنك القيام بذلك بإستعمال إضافة WP Rocket أو a3 Lazy Load.

7. استبعاد موارد حظر العرض (JavaScript/CSS)

تحظر ملفات CSS و JavaScript سرعة عرض الصفحة من خلال التحميل المتزامن (Sync). ويمكنك تضمين عناصر JavaScript/CSS المهمة وتأجيل جميع ملفات CSS/JavaScript غير المهمة.

يبدو الأمر معقد أليس كذلك؟ ولكنه أسهل مما تتصور! حيث يمكنك تجاوز هذا الإختبار بسهولة مع إضافة WP Rocket. ما عليك سوى الذهاب إلى لوحة تحكم WP Rocket ← تحسين الملفات ثم تفعيل خيار تحسين ملفات CSS و Defer JS.

سيتم تفعيل المسار الحرج Critical Path CSS والذي يجعل ملفات CSS تضهر بشكل غير متزامن. وسيعمل خيار defer JS على حجب جميع ملفات JavaScript إلى آخر الصفحة. بعد القيام بذلك، لن تواجهك مشكلات حظر العرض في تقرير PageSpeed Insights إطلاقاً.

8. لا تكن مكتنز الإضافات

إذا كنت تستخدم CMS مثل WordPress و Joomla وما إلى ذلك، فعليك بالتأكيد تجنب استخدام الكثير من المكونات الإضافية.

المزيد من الإضافات = موقع أبطأ.

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

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

9. تجنب الإضافات البطيئة

تشتمل معظم الإضافات البطيئة على المشاركة الاجتماعية، والسلايدر، ومُنشئي الصفحات، والمقالات ذات الصلة، والإحصائيات، والدردشة الحية، والمكونات الإضافية التي تقوم بإجراء عمليات مسح/عمليات مستمرة أو تظهر عدة مرات في تقرير GTmetrix.

1. AddThis
2. AdSense Click Fraud Monitoring
3. Backup Buddy
4. Beaver Builder
5. Better WordPress Google XML Sitemaps
6. Broken Link checker
7. Contextual Related Posts
8. Digi Auto Links
9. Divi Builder
10. شاهد القائمة الكاملة من 64 إضافة بطيئة

10. تقليل استخدام الرموز التابعة لجهات خارجية

إذا كنت تستخدم سكربتات تابعة لجهات خارجية ، فستتسبب في طلبات إضافية وستظهر في تقرير Google PageSpeed Insights الخاص بك. يصعب بل من المستحيل تحسين بعض السكربتات (خاصةً Google AdSense وعناصر واجهة المستخدم الاجتماعية التي من الأفضل تجنبها معًا)، لكنني أدرجت بعض التحسينات أدناه.

نصائح لتحسين الرموز التابعة لجهات خارجية

• Disques + Gravatars - استخدم conditional load أو Flying Scripts.
• Contact Form 7 - قم بتحميله بشكل غير متزامن.
• Google AdSense - أعمل Delay لمدة 2s لسكربت adsbygoogle.js بإستخدام Flying Scripts.
• Google Analytics - استضافته محليًا باستخدام WP Rocket أو Flying Analytics.
• خرائط Google - استخدمها فقط على الصفحات التي تحتاجها (مثل نموذج الاتصال)
• خطوط جوجل - ادمج خطوط Google في WP Rocket أو Autoptimize أو جرب OMGF. أو قم باستضافة الخطوط محليًا عن طريق تنزيلها مباشرةً من Google Fonts.
• مقاطع فيديو يوتيوب المضمنة - التحميل الكسول للفيديو واستبدال إطارات iframes بمعاينة باستخدام WP Rocket، أو استخدم إضافة WP YouTube Lyte.
• قم بتحميل الإضافات بشكل انتقائي - استخدم Clearfy أو Perfmatters لتعطيل الإضافات (خاصة تلك التي تحتوي على سكربتات خارجية) من التحميل على محتوى معين.

11. تحسين وقت استجابة الخادم (TTFB)

يتم تحديد TTFB بشكل أساسي من خلال الاستضافة.

تتمثل القاعدة الأساسية الجيدة في تخطي الاستضافة المشتركة معًا والانتقال مباشرة إلى الاستضافة السحابية، خاصةً إذا كنت تقوم بتشغيل إضافات ثقيلة أو أدوات إنشاء صفحات. تعد Cloudways و GridPane و LiteSpeed و RunCloud خيارات جيدة بشكل عام بينما SiteGround و EIG (أي Bluehost) و GoDaddy ليست كذلك.

أنا شخصياً أستخدم Cloudways DigitalOcean.

راجع دليل تحسين TTFB الخاص بي أيضاً والذي أشرح فيه كيفية تقليل وقت استجابة الخادم (TTFB) في ووردبريس إلى أقل من 200ms.

12. تقليل وقت تنفيذ JavaScript

تمت تغطية معظم تلميحات JavaScript بالفعل في هذا الدليل (على سبيل المثال، إزالة JS غير المستخدمة). تركز مؤشرات أداء الويب الأساسية بشدة على تحسين JavaScript الذي يمكنه تحسين عناصر متعددة في تقريرك.

• قم بإزالة JavaScript غير المستخدمة
• تصغير JavaScript
• تحسين JavaScript باستخدام Autoptimize + Async JavaScript
• استخدم ضغط Brotli، وتجنب أدوات إنشاء الصفحات الثقيلة، وقم بتأخير JavaScript غير الهام
• قم بتحسين ملفات JavaScript عالية التأثير في تقرير PageSpeed Insights

13. إزالة خدمة CSS غير المُستخدَمة

تتمثل الخطوة الأولى لإزالة CSS غير المستخدمة في استخدام إضافة لتعطيل السكربتات الغير مستخدمة (مثل Clearfy أو Perfmatters) لتعطيل ملفات CSS حيث لا يتم استخدامها.

هناك أيضًا إضافات/أدوات لإزالة CSS غير المستخدمة. يقدم الإصدار الجديد من WP Rocket 3.9 ميزة إزالة ملفات CSS غير المستخدمة تلقائياً.

أثناء معالجة CSS ، سترى شريط تقدم. عند اكتمال العملية، سترى رسالة تأكيد:

يقوم المكون الإضافي RapidLoad المميز من Autoptimize بأتمتة إزالة CSS غير المستخدمة. قد تكون الأدوات المجانية عبر الإنترنت مثل PurifyCSS و Unused-CSS جديرة بالتجربة أيضًا، ولكنها قد تكون صعبة بعض الشيء إذا كنت لا تعرف ما تفعله.

14. إزالة JavaScript غير المستخدم

يمكن أن تؤدي إزالة JavaScript غير المستخدم إلى تحسين عناصر متعددة:

• وقت تنفيذ جافا سكريبت
• حمولات شبكة هائلة
• تأخير الإدخال الأول (FID) + إجمالي وقت الحجب
• وبالطبع، إزالة JavaScript غير المستخدم

استخدام إضافات تعطيل السكربتات - تعد Clearfy و Perfmatters من الإضافات الشائعة لإزالة JavaScript و CSS غير المستخدمة. أنا أستخدم Perfmatters لأن واجهة المستخدم/UX أسهل. يحتوي كلاهما على خيارات إزالة bloat وميزات سرعة أخرى (العديد منها غير مضمّن مع WP Rocket وإضافات الكاش الأخرى).

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

• تعطيل اضافة السلايدر في الصفحات التي لا تستخدم سلايدر
• تعطيل اضافة المشاركة الاجتماعية في جميع الصفحات (لأنه عادةً ما يكون لمشاركات المدونة)

إزالة JS/CSS غير المستخدمة لمُنشئ الصفحات - يقوم Elementor وأدوات إنشاء الصفحات الأخرى بتحميل ملفات CSS و JavaScript التي قد لا تستخدمها. على سبيل المثال، قد تكون قادرًا على تعطيل elementor-sticky ، و dialog ، و share-link ، و swiper ، و animations ، و wp-block-library إذا لم تستخدمها.

ملخص

• قم بإزالة JavaScript غير المستخدمة باستخدام Clearfy أو Perfmatters
• استخدم الإضافة لتعطيل JS/CSS غير المستخدمة من أدوات إنشاء الصفحات
• قم بتنشيط "Improved Asset Loading" في إعدادات Elementor Experiment
• تقليل تأثير الرموز التابعة لجهات خارجية
• قم بتأخير JavaScript باستخدام WP Rocket أو Flying Scripts
• قم بتعطيل سكربتات ووكومرس والأنماط على المحتوى غير المتعلق بالتجارة الإلكترونية (يقوم كل من Perfmatters و Disable WooCommerce Bloat بفعل ذلك)

15. التحديث إلى PHP 7.4

لا تزال العديد من مواقع ووردبريس تشغل PHP 5 على الرغم من أن PHP 7.4 أسرع بكثير. وذلك لأن شركات الاستضافة لن تقوم تلقائيًا بترقية إصدار PHP الخاص بك (بسبب مشكلات التوافق المحتملة) والتي يمكنك استخدام المكون الإضافي PHP Compatibility Checker للتحقق منها.

قم بالترقية إلى PHP 7.4 في حساب الاستضافة الخاص بك، ثم تحقق من موقعك بحثًا عن الأخطاء:

تأكد من تحديث MySQL أو MariaDB أيضًا إلى أحدث إصدار.

16. زيادة حد الذاكرة إلى 256MB

يتطلب كل من Elementor و WooCommerce حدًا للذاكرة يبلغ 256MB ، ولكن يجب عليك حقًا زيادته إلى 256 ميجابايت على أي حال خاصةً إذا كان موقع الويب الخاص بك يعاني من أخطاء فادحة في حد الذاكرة.

أضف الكود إلى ملف wp-config.php الخاص بك قبل "That's All Happy Blogging".

define('WP_MEMORY_LIMIT', '256M');

تسمح بعض الإستضافات المشتركة بهذا بينما يطلب منك المضيفون الآخرون الاتصال بهم. يسمح مقدمو خدمات الاستضافة السحابية دائمًا بهذا (أدناه لـ Cloudways).

الخلاصة

لم تعد عملية تسريع ووردبريس سهلة مثل تهيئة إضافة الكاش بعد الآن.

يجب أن تكون المواقع جيدة من الألف إلى الياء. من الاستضافة إلى أدوات إنشاء الصفحات (أو عدم وجودها)، فإن المكونات الإضافية والخطوط وشبكات CDN وحتى كيفية تصميم صفحاتك جميعها لها تأثير على تقرير Google PageSpeed Insights ومؤشرات أداء الويب الأساسية.

يعد تحقيق درجة عالية من سرعة الصفحة أمرًا ضروريًا لتحسين محركات البحث هذه الأيام، مع زيادة استخدام الجهاز المحمول. لذا ادفع نفسك نحو الحصول على 100% في Google PageSpeed Insights. إنه يستحق ذلك تمامًا.