دليل المبتدئين لتحسين سرعة موقع الويب إصلاح موقعك البطيء

ألست متأكدًا من كيفية زيادة السرعة الإجمالية لموقعك على الويب؟

سرعة موقع الويب هي الجزء الأساسي من مُحسّنات محرّكات البحث الحديثة ، وثق بي ؛ لها تأثير فوري وهام على الترتيب.

إذا قمت بزيارة موقع الويب الخاص بي TheGuideX ، فستلاحظ أن تحميل موقعي أقل من ثانية واحدة (لقد أرفقت أيضًا نتيجة GTmertix أدناه).

وفقًا لـ GTmetrix ، تبلغ درجة PageSpeed ​​الخاصة بـ TheGuideX.com 100٪ ونسبة YSlow حوالي 95٪ مع وقت تحميل يبلغ 0.9 ثانية و 23 طلبًا فقط من طلبات HTTP. هذا مدهش.

... وهنا تقرير آخر من TheVPNCoupon.com ، حيث أقوم بالتدوين عن الشبكات الافتراضية الخاصة.

ووفقًا لـ GTmetrix ، تبلغ درجة PageSpeed ​​لمدونتي الأخرى (TheVPNCoupon.com) حوالي 99٪ ودرجة YSlow بنسبة 95٪ مع طلبات 23-HTTP ويتم تحميل هذا الموقع أيضًا أقل من ثانية واحدة (على الرغم من أن تحميل هذا الموقع يستغرق 800 مللي ثانية فقط موقع الكتروني).

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

إذن ماذا أفعل لتحسين سرعة موقع الويب الخاص بي؟ وهل تحتاج إلى أي مهارات فنية أو تطويرية لتحسين موقعك؟

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

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

إذا كانت لديك معرفة أساسية حول VPS ، فإنني أوصيك بنقل موقع الويب الخاص بك أولاً إلى DigitalOcean أو Cloudways ، وإذا كنت تريد استضافة تستند إلى cPanel ، فيمكنك التغيير إلى SiteGround.

تأكد أيضًا من استخدام CDN على موقع الويب الخاص بك. إذا كنت تبحث عن مزود CDN مجاني ، فسأوصيك بـ Cloudflare. يمكنك أيضًا استخدام ImageKit لـ Image CDN (أنا أستخدم هذا على موقع الويب الخاص بي ، وهو يساعدني في تحسين الصور في الوقت الفعلي).

قبل أن نتعمق في تقنيات تحسين السرعة ، نتعلم أولاً

لماذا تعتبر السرعة مهمة؟

إذن ما هي المدة التي تنتظرها حتى يتم تحميل موقع ويب؟

حسنًا ، وفقًا للإحصاءات ، نصفنا وحتى عندما يتعلق الأمر بي ، لا أريد الانتظار لمدة ثانيتين حتى يتم تحميل موقع ويب.

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

لكن ما أهمية سرعة موقع الويب؟ وما الفرق الذي يحدثه جزء من الثواني؟

الاجابة؟ تحدث فرقا كبيرا!

ولكن كيف تحدث فرقا كبيرا؟ دعنا نرى تقريرًا مفصلاً لمعرفة المزيد حول سبب أهمية السرعة.

1. المواقع الإلكترونية البطيئة تقتل التحويلات:

يمكن أن يقتل موقع الويب البطيء تحويلات موقع الويب الخاص بك.

دعنا نتخيل ما إذا كنت أحد مواقع التجارة الإلكترونية ، ويستغرق تحميل موقع الويب حوالي أربع ثوانٍ. ووفقًا لتقارير مختلفة ، يمكن لـ 40٪ من الأشخاص مغادرة موقعك إذا استغرق تحميله أكثر من ثلاث ثوانٍ.

وبهذا المعنى ، إذا كان موقع الويب الخاص بك يتلقى حوالي 1،00،000 حركة مرور شهريًا ويستغرق تحميل موقع الويب الخاص بك حوالي أربع ثوانٍ ، فهناك العديد من الفرص التي يمكن أن يتخلى عنها ما يصل إلى 40000 شخص من موقعك.

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

2. نتوقع السرعة وتجربة المستخدم:

كما ذكرت أعلاه ، يغادر 40٪ من الأشخاص موقع الويب الخاص بك إذا استغرق تحميله أكثر من ثلاث ثوان. وعندما يتعلق الأمر بي ، أترك الموقع دائمًا ، ويستغرق تحميله ثانيتين أو أكثر.

WTH الانتظار لمدة ثانيتين لتحميل الموقع؟

إذا لم أستطع الانتظار لمدة ثانيتين ، فلا يمكنني أن أتوقع بقاء القراء لفترة طويلة.

هناك عاملان أساسيان في تجربة المستخدم الجيدة:

1. منح الزائرين ما يبحثون عنه و
2. يعطيها لهم بسرعة.

فيما يلي بعض عوامل الترتيب على تجربة صفحة Google الجديدة والتي يمكنك التفكير في تحسينها على موقع الويب الخاص بك.

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

إذا كنت تريد حقًا تحسين الأداء العام لموقعك على الويب ، فيجب أن تكون سرعة تحميل موقع الويب على رأس أولوياتك.

3. سرعة موقع الويب تؤثر على ترتيبك في Google:

أخيرًا وليس آخرًا ، إنها تهيمن على تصنيف Google.

لقد اعترفت Google بالفعل بأنها تسعى جاهدة لجعل الويب بأكمله سريعًا. إنهم في مهمة جعل موقع الويب سريعًا للغاية وأكثر موثوقية وفائدة.

لا يمكن أن يكون ذلك ممكنًا بدون سرعة تحميل جيدة ، وهم يمنحون الأولوية للمواقع ذات سرعة التحميل السريعة. ووفقًا لمعرفتي ، فقد أعلنوا في عام 2010 أنهم يمنحون تفضيلًا أكبر قليلاً لمواقع الويب التي تتمتع بسرعة تحميل سريعة.

ووفقًا لتقرير صادر عن SERoundtable ، إذا استغرق موقع الويب الخاص بك أكثر من ثانيتين لتحميل المحتوى ، فقد تحد Google من عدد برامج الزحف التي يرسلها إلى موقعك.

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

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

اعتبارًا من الآن ، أنا متأكد من أنك تعلمت مدى أهمية موقع التحميل السريع.

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

أدوات اختبار سرعة الموقع

حسنًا ، تحسين سرعة الموقع مهم جدًا! الآن ، كيف تعرف أين أنت؟

هذا هو موقع الويب الخاص بك بطيء؟ هل هي في المنتصف أم أنها سريعة البرق (تهانينا إذًا ، ربما يمكنك التوقف عن القراءة!).

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

1. GTmetrix

GTmetrix هي واحدة من أفضل الأدوات للتحقق من أداء الموقع. هذه الأداة هي خيار جيد للمستخدمين العاديين والمطورين.

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

عند النقر فوق الزر " تحليل " ، سيستغرق الأمر بضع ثوانٍ أو أحيانًا دقيقة واحدة للرد مع تحليل مفصل لموقع الويب الخاص بك.

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

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

2. بينغدوم

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

لاستخدام هذه الأداة ، أدخل عنوان موقع الويب الخاص بك ثم حدد " موقع الاختبار". بمجرد اختيار موقع الاختبار ، انقر فوق الزر " بدء الاختبار" ، وسيبدأ في تحليل الصفحة.

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

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

3. Google PageSpeed ​​Insights

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

لكن هذا تغير. الآن ، ستشارك Google وقت تحميل الصفحة لكل من First Contentful Paint (FCP) و DOM Content Loaded (DCL) . يمكنك معرفة المزيد حول مقاييس السرعة هذه على صفحة مطور Google الرسمية هنا.

إذا كانت لديك نقاط سرعة صفحات منخفضة بالإضافة إلى وقت تحميل ضعيف ، فهذا الدليل مناسب لك! يمكنك قراءة هذا الدليل حتى النهاية لتحسين موقع الويب الخاص بك بشكل صحيح على Google PageSpeed ​​Insight ومواقع الويب الأخرى.

يمكنك أيضًا مراجعة دليلنا الآخر حول حل Flash of Invisible Text (FOIT) لتحسين خطوط موقع الويب الخاص بك.

4. WebPageTest

أخيرًا وليس أقلها أداة مستخدمة للتحقق من سرعة موقع الويب هي WebPageTest. هذه الأداة هي واحدة من أكثر أدوات اختبار سرعة WordPress تقدمًا من حيث عمق الوظائف والبيانات التي توفرها.

عندما تتحقق من سرعة موقع الويب الخاص بك باستخدام أداة WebPageTest ، يمكنك استخدام بعض الإعدادات المتقدمة لتحليل موقع الويب الخاص بك. يمكنك استخدام هذه الإعدادات المتقدمة لـ ؛

إذا قمت بفحص هذه التغريدة بواسطة John Mueller من بحث Google ، فإنه يوصي أيضًا باستخدام أداة WebPageTest للتحقق من سرعة تحميل موقع الويب.

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

حتى الآن ، تعلمنا أهمية وجود موقع ويب سريع التحميل وأدوات للتحقق من سرعة الموقع.

حان الوقت الآن لمشاركة التقنيات لتحسين موقع الويب الخاص بك بشكل صحيح.

هنا في هذا البرنامج التعليمي ، لن أشارك فقط خطوات استخدام مكون إضافي لذاكرة التخزين المؤقت لتحسين CSS أو JS أو HTML أو لاستخدام CDN كما يفعل الآخرون ، لكنني سأشارك أكثر الطرق التي يمكن الوصول إليها والتي يمكنك من خلالها القيام بهذه التحسينات بشكل صحيح.

هذه الطرق بسيطة وأبسط مع أمثلة ؛

ولكن قبل متابعة هذه الطرق ، أوصيك أولاً بأخذ نسخة احتياطية من موقع WordPress الخاص بك باستخدام المكون الإضافي Updraft Backup ، والذي يتوفر مجانًا في WordPress repo.

بمجرد أخذ النسخة الاحتياطية من موقع WordPress الخاص بك ، يمكننا الاستمرار في تحسين الموقع.

فكيف ...

تحسين موقع الويب الخاص بك

الآن، والانتظار قد انتهى!

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

1. اختيار استضافة ويب سريعة وموثوقة

لذا فإن الخطوة الأولى هي اختيار مزود استضافة ويب موثوق وسريع.

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

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

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

يمكن أن تتضمن هذه اللوحات ServerPilot و VestaCP وغير ذلك الكثير - لكنني أوصي دائمًا باستخدام ServerPilot لأنها واحدة من أسهل لوحات التحكم لتثبيت WordPress (يمكنك النقر هنا للحصول على رصيد مجاني بقيمة 10 دولارات على ServerPilot).

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

1.1 الاستضافة الموصى بها

1.2 لا ينصح بالاستضافة

2. اختيار موضوع ووردبريس الأمثل

عند تحديد سمة لموقع الويب الخاص بك على WordPress ، من الضروري تحديد سمة محسّنة للسرعة. بعض السمات الجميلة والمثيرة للإعجاب مشفرة بشكل سيئ ويمكن أن تجعل موقع الويب الخاص بك بطيئًا حقًا.

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

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

إذا كنت بحاجة إلى أي موضوع توصية ، فإنني أقترح عليك تفضيل سمات WordPress المتميزة من StudioPress و MyThemeShop و GeneratePress. تم تحسين الموضوعات من هذه الأسواق وترميزها جيدًا لكل من السرعة وتحسين محركات البحث. (أنا شخصياً أفضل استخدام موضوع GeneratePress على مواقع الويب الخاصة بي)

يمكنك أيضًا التحقق من Astra ، وهو موضوع آخر مُحسَّن للسرعة وتحسين محركات البحث. على غرار GeneratePress ، يأتي هذا المظهر أيضًا مع الكثير من خيارات التخصيص وهو أحد أكثر السمات تنزيلًا في WordPress repo مع أكثر من 700 ألف تثبيت نشط.

2.1 المواضيع الموصى بها

لقد ناقشنا حتى الآن حول موفري استضافة ويب موثوق بهم وسريع وموضوع WordPress سريع وموثوق.

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

3. التحسين باستخدام ملحقات WordPress

لذلك قبل أن نناقش تحسين موقع WordPress الخاص بك باستخدام بعض المكونات الإضافية ، نفترض أنك تهتم بالفعل بأمرين ؛

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

3.1 قم بتحسين موقعك باستخدام WP Rocket

لذا فإن أول مكون إضافي نستخدمه لتحسين سرعة WordPress هو WP Rocket.

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

يمكن أن يساعدك البرنامج المساعد على التحسين ؛

الآن ، فهمنا أساسيات استخدام هذا المكون الإضافي. سنعرض لك الآن كيفية تحسين موقع الويب الخاص بك بشكل صحيح باستخدام المكون الإضافي WP-Rocket cache.

إذا كنت تستخدم أي مكون إضافي لذاكرة التخزين المؤقت ، فأنصحك بالكاد بالانتقال إلى WP-Rocket.

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

لذا…

كيفية استخدام WP-Rocket بشكل فعال؟

ستجد العديد من الميزات في المكون الإضافي WP-Rocket ، وهل تساءلت يومًا عن الإعدادات التي يجب تنشيطها على موقع الويب الخاص بك لجعله سريعًا؟

بمجرد تثبيت وتفعيل المكون الإضافي WP-Rocket في موقع WordPress الخاص بك ، انتقل إلى " الإعدادات "> " WP Rocket " لفتح صفحة التكوين.

الآن ، انقر فوق إعدادات " ذاكرة التخزين المؤقت " لتعيين ذاكرة التخزين المؤقت لموقع الويب باستخدام المكون الإضافي WP-Rocket. (سيظهر شيئًا كهذا)

بادئ ذي بدء ، يجب عليك تمكين " ذاكرة التخزين المؤقت للجوال " ، وإذا كنت تقوم بإعداد ذاكرة التخزين المؤقت للتجارة الإلكترونية ، فقم بتمكين إعدادات " ذاكرة التخزين المؤقت للمستخدم الذي قام بتسجيل الدخول ".

ثم اضبط " Cache Lifespan " على " 10 ساعات ".

بمجرد الانتهاء من إعدادات ذاكرة التخزين المؤقت ، سننتقل إلى " تحسين الملفات " حيث يمكننا تصغير HTML و CSS و JS و Defer JS و Combine CSS & JS.

هذه الإعدادات هي واحدة من أهم إعدادات WP-Rocket. سيساعدك أيضًا على تقليل طلب HTTP من خلال الجمع بين CSS و JS لموقعك.

عند النقر فوق جزء " تحسين الملفات " ، ستحصل على خيارات متنوعة لتقليل HTML و CSS و JS ودمجها في عدد أقل من الملفات.

وفي " الإعدادات الأساسية" ، حدد جميع الخيارات الثلاثة لـ " Minify HTML" ، و " Combine Google Font Files" ، و " Remove Query Strings". لن يؤثر ذلك على موقع الويب الخاص بك - ولكن عند تنشيط إعدادات " ملفات CSS " و " ملفات JS " ، تأكد من عدم تعطل موقعك.

تحقق الآن من الخيار "Minify CSS" و "Combine CSS" و "Optimize CSS Delivery" في ملفات CSS لتقليل CSS ودمجها في ملفات أقل. سيؤدي أيضًا إلى إصلاح مشكلة " يزيل CSS لحظر العرض" على موقع الويب الخاص بك.

وبالمثل ، في قسم ملفات JS ، انقر فوق "Remove JQuery Migrate" ، و "Minify JS" ، و "Combine JavaScript Files" ، و "Load JavaScript Defified" ، ثم قم بتمكين "Safe Mode for JQuery" ضمن قسم JS المؤجل.

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

بعد إعدادات File Optimization ، ستحصل على الإعدادات لإدارة Lazy loading & Media. انقر فوق خيار الوسائط لإجراء تغييرات في إعدادات الوسائط ؛

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

سأقترح عليك تمكين إعدادات Lazyload للصور و iframe ومقاطع الفيديو. يمكنك أيضًا استبدال مقاطع فيديو YouTube أو إطارات iframe بالصور (صدقني ، ستجعل موقعك على الويب سريعًا).

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

بعد إعدادات الوسائط ، ستحصل على خيار لتمكين التحميل المسبق على موقع الويب الخاص بك.

لماذا يعتبر التحميل المسبق النقدي ضروريًا لتحسين أداء موقعك؟

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

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

بعد ذلك ، ستحصل على خيار لإدارة تحسين قاعدة البيانات و CDN ، لكننا سنتخطى هذا الإعداد هنا. ونستخدم المكون الإضافي WP-Optimize لتحسين قاعدة البيانات بكفاءة ، وسنعرض لك كيفية تنفيذ CDN لاحقًا في قسم CDN.

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

ما زلت غير قادر على فهم إعدادات ضربات القلب؟ هنا أشارك بعض الأمثلة حول إعدادات نبضات القلب ؛

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

والآن ، الإعداد الأخير ، ولكن ليس الأقل في المكون الإضافي WP-Rocket ، هو إعدادات الوظائف الإضافية الخاصة بهم. إذا كنت تستخدم Facebook Pixel و Google Analytics على موقع الويب الخاص بك ، فسيساعدك ذلك على تخزينهما محليًا على خادمك لتحسين سرعة الموقع.

يمكنك ببساطة تمكينه لتحسين مشكلة التخزين المؤقت لمتصفح الرافعة المالية على موقع الويب الخاص بك.

يمكن أن تتضمن الوظيفة الإضافية الرائعة الأخرى دمج موقع الويب الخاص بك مع Cloudflare & Sucuri مباشرة من لوحة معلومات WP-Rocket. سيساعدك ذلك على مسح ذاكرة التخزين المؤقت وتطهيرها من مزودي CDN هؤلاء كلما قمت بمسح شيء ما على موقع الويب الخاص بك.

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

اعتبارًا من الآن ، قمنا بتنفيذ بعض التحسينات باستخدام المكون الإضافي WP-Rocket.

سنستخدم الآن بعض المكونات الإضافية الأخرى مثل WP-Optimize لتحسين قاعدة البيانات و AssetCleanUp Pro لتحسين السرعة بشكل أكبر.

3.2 تحسين موقعك باستخدام Asset CleanUp Pro

بمجرد قيامك بتحسين موقع الويب الخاص بك باستخدام WP Rocket والتحقق من نتيجة GTmetrix & Pingdom ، سترى تحسنًا فوريًا في سرعة تحميل الصفحة.

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

لذلك سنستخدم الآن بعض المكونات الإضافية الأخرى مثل Asset CleanUp Pro لمزيد من التحسين لموقعنا على الويب (يمكنك أيضًا استخدام الإصدار المجاني من Asset CleanUp للتحسين ، لكنني أقترح الحصول على البرنامج المدفوع).

يمكن أن يساعدك هذا المكون الإضافي في إصلاح مشكلة Flash of Invisible Text (FOIT) على موقع الويب الخاص بك ، كما أنه يحظر الوصول إلى ملف XML-RPC والقيام بالكثير من الأشياء.

نظرًا لأننا قمنا بالفعل بتحسين موقعنا باستخدام WP Rocket ، فقد تم حظر تعديل HTML و CSS و JS وبعض الإعدادات الأخرى ، ولا يمكننا تمكينها (هذا شيء جيد!)

بمجرد تمكين وضع الاختبار ، انقر الآن على خيار Optimize CSS ثم قم بالتمرير لأسفل إلى إعدادات Cache Dynamic Loaded CSS ثم قم بتمكينه.

بمجرد القيام بذلك ، انقر فوق الزر حفظ .

وبالمثل ، في قسم Optimize JS ، قم بتمكين Cache Dynamic Loaded JavaScript.

ستساعدك هذه الخيارات على تخزين القيم الديناميكية لـ CSS & JS. على الرغم من أنك لن تواجه هذه المشكلات في WordPress بعد استخدام WP-Rocket.

بمجرد الانتهاء من هذه الإعدادات ، انقر فوق إعدادات " Site-Wide Common Unloads " بعد خيار " CDN ".

ستجد هنا بعض الخيارات لتعطيل Emojis و Embeds و Dashicons و Gutenberg CSS Block Library و JQuery Migrate و Comment Reply على مستوى الموقع .

ولكن إذا كنت لا تستخدم رمز Gutenberg، Dashicons على مدونتك ، فيمكنك تعطيلها.

وإذا كنت لا تستخدم WordPress كمدونة ، أو لا تريد للزائرين ترك تعليقات ، أو قمت باستبدال تعليقات WordPress الافتراضية بمنصة تعليق مثل Disqus أو Facebook ، فيمكنك أيضًا تعطيل "موقع الرد على التعليقات- واسعة "من الإعدادات.

الآن ، سننتقل إلى قسم " تنظيف مصدر HTML " حيث يمكننا إزالة العناصر غير المستخدمة من قسم <head>.

من هذه الإعدادات ، يمكننا إزالة العناصر غير المرغوب فيها من أقسام <head>.

لا تقلق!

لن تؤثر إزالة هذه العناصر على موقعك على الإطلاق.

لقد أزلت العديد من الخيارات من هذه الإعدادات ، بما في ذلك تعليق RSS وعلامات مولد التعريف وعلامات إصدار WordPress و REST API وروابط RSD.

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

وإذا كنت تستخدم الإصدار المتميز من Asset Cleanup Pro ، فيمكنك تغيير قيمة " Apply font-display CSS " من " لا تطبق " إلى " Swap". هذا يمكن أن يمنع موقع الويب الخاص بك من وميض مشكلة النص غير المرئي. يمكنك النقر هنا لمعرفة المزيد عن هذه المشكلة.

يمكنك أيضًا إدخال عنوان URL لملفات الخطوط المحلية في قسم التحميل المسبق لتحميله على الفور. عندما نقوم بتحميل ملف خط مسبقًا ، فإننا نزيد بوضوح أولوية المورد.

وبعد إعدادات Local Font Optimization ، سترى خيارًا مشابهًا في " Google Fonts". إعداد.

ما عليك سوى تحديد خيار " التبديل " في إعدادات عرض الخط وكذلك تمكين الاتصال المسبق . سيؤدي تمكين خيار الاتصال المسبق إلى تلميح وإرشاد المتصفح للاتصال المسبق بخطوط Google أثناء تحميل CSS ، مما يوفر وقت التحميل.

استخدم الإضافات والأدوات على الصفحات الضرورية فقط باستخدام Asset CleanUp Pro.

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

يمكن أن تتضمن هذه الميزات تحميل المكونات الإضافية في منشور معين على موقع الويب.

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

لكن المشكلة الرئيسية في هذا المكون الإضافي هي أنه يقوم بتحميل ملف CSS & JS الخاص به في قسم <head> في موقعك ، وبالتالي ، فإنه يزيد من طلبين آخرين على جميع الصفحات (بما في ذلك صفحة الاتصال) - لكننا نحتاج فقط إلى التحميل على الصفحة المحددة ، وهذه هي صفحة الاتصال .

علي سبيل المثال؛ إذا قمت بفحص TheVPNCoupon ، فأنا أستخدم المكون الإضافي "Contact Form 7" في صفحة الاتصال وفي المنشور / الصفحات الأخرى مثل "Best Animated Movies" ، فأنا لا أستخدم أي نموذج اتصال - ولكن لا يزال يتم تحميل CSS & JS من ملحق نموذج الاتصال 7 في هذه الصفحات (يمكنك التحقق من الصورة أدناه).

لكن كيف يمكنك حل هذه المشكلة؟

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

ثم قم بإلغاء تحميل ملف CSS & JS المحدد من خيار Asset CleanUp.

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

بمجرد النقر فوق " تحرير الصفحة" ، ستظهر جميع الملفات المطلوبة أو التي تم تحميلها عندما يقوم شخص ما بتحميل صفحة الاتصال.

سنقوم الآن بإجراء بعض التغييرات على الإعدادات وإلغاء تحميل CSS & JS لنموذج الاتصال 7 من جميع الصفحات باستثناء صفحة الاتصال (يمكنك تنفيذ نفس الإعدادات التي قمنا بها في الصورة أعلاه).

3.3 تحسين الصور على موقع الويب

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

حتى عندما تتحقق من أي من منشورات مدونتنا على TheGuideX ،

... الصور أثقل من أي شيء آخر على موقع الويب الخاص بي.

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

نعلم جميعًا أن الصور ضرورية لأي موقع ويب ، ولكن لا يوصى باستخدام صور عالية الجودة بشكل ملحوظ. وبالتالي ، يتعين علينا التأكد من أن الصورة التي نحملها محسّنة بشكل صحيح.

يجب أن تضطر إلى ضغط الصور بطريقة لا تقلل من الجودة الإجمالية لصورتك ولكنها تقلل فقط من حجمها.

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

لتحسين صورك بشكل صحيح ، عليك اتباع هذه الخطوات الخمس ؛

استخدم نوع تنسيق الصورة الصحيح

أكثر أنواع الصور شيوعًا على الويب هما JPGs و PNG.

وهم ليسوا متشابهين.

مثال على صورة JPEG

تفاصيل الصورة
شكل صورة	JPEG
حجم الصورة	2.893 كيلو بايت
حجم الصورة الأمثل	607 كيلوبايت
ضغط الصور النسبة المئوية للعمر	79٪
وصف الصورة	صورة معقدة مع الكثير من معلومات اللون.

مثال على صورة PNG

تفاصيل الصورة
شكل صورة	بي إن جي
حجم الصورة	716 كيلو بايت
حجم الصورة الأمثل	173 كيلو بايت
ضغط الصور النسبة المئوية للعمر	75٪
وصف الصورة	صورة بسيطة مع القليل من معلومات اللون

في الأمثلة أعلاه ، لقد عرضت صورة JPG واحدة مع ضغط صورة بنسبة 79٪ وصورة PNG بمستوى ضغط مماثل - لكن الحجم المضغوط لصورة JPEG هو أكثر بكثير من الحجم الأصلي لصورة PNG بسبب تعقيدها و الكثير من معلومات الألوان.

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

3.4 تحسين قواعد البيانات باستخدام WP-Optimize

اعتبارًا من الآن ، قمنا بتحسين موقعنا باستخدام WP Rocket و Asset CleanUp ، ولكن إذا كنت لا تزال تشعر أن موقع الويب الخاص بك يستغرق الكثير من الوقت للتحميل ، فيمكنك حينئذٍ تحسين قاعدة البيانات الخاصة بك وحذف المراجعات المنشورة.

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

لذا فإن تحسين قاعدة البيانات هو عملية أخرى مفيدة ومهمة للغاية لزيادة سرعة موقع الويب.

للقيام بذلك ، سنستخدم مكونًا إضافيًا مجانيًا لبرنامج WordPress باسم " WP-Optimize". تم تطوير المكون الإضافي بواسطة Team Updraft ، الذي طور أيضًا مكونًا إضافيًا رائعًا ، أوصي به لأخذ نسخة احتياطية من موقعك.

لاستخدام هذا البرنامج المساعد ، ما عليك سوى تثبيت المكون الإضافي "WP-Optimize" من مستودع WordPress.

بمجرد تثبيت المكون الإضافي ، أوصي بأخذ نسخة احتياطية من قاعدة البيانات الخاصة بك ثم الانتقال إلى " WP-Optimize "> " قاعدة البيانات". وعندما تكون في صفحة قاعدة البيانات ، انقر فوق " تشغيل جميع التحسينات المحددة " ، وسيبدأ في تحسين قاعدة البيانات.

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

لا تقلق!

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

3.5 لا تستخدم هذه المكونات الإضافية على موقع الويب الخاص بك

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

يمكن أن تشمل هذه المكونات الإضافية ؛

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

لكن تحسين السرعة لا يتعلق فقط بتحسين الموقع باستخدام بعض المكونات الإضافية أو موضوع WordPress سريع التحميل.

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

4. استخدام شبكة توصيل المحتوى (CDN)

قبل أن أشرح كيف يمكنك استخدام CDN لزيادة أداء موقع الويب الخاص بك ، سنتعلم أولاً ما هو CDN وكيف يمكن أن يساعد في تحسين أداء موقع الويب.

إذن ما هي شبكة توصيل المحتوى أو شبكة توصيل المحتوى؟

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

فكيف يمكن أن يساعد في زيادة أداء الموقع؟

الجواب هو؛ عندما تقوم بزيارة موقع ويب ، فإنه يقدم طلبات إلى الخادم البعيد ، ويستجيب هذا الخادم مرة أخرى بالبيانات. يتم نقل البيانات عبر الإنترنت العام ، ويؤدي إلى بعض التأخير.

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

لقد فهمنا الآن استخدام CDN على موقعنا الإلكتروني وكيف أنه من الضروري زيادة الأداء العام لموقعنا على الويب.

سنناقش الآن بعض شبكات CDN لزيادة أداء موقعنا على الويب ؛

4.1 استخدم Cloudflare على موقع الويب

أول شبكة توصيل محتوى يستخدمه معظم الأشخاص على موقع الويب الخاص بهم هي Cloudflare.

قامت Cloudflare ببناء شبكة عالمية موسعة من مراكز البيانات التي تخزن محتوى ثابتًا مؤقتًا بالقرب من المستخدمين وتقدم محتوى ديناميكيًا عبر الروابط الأساسية الخاصة الأسرع والأكثر موثوقية

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

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

الآن ، انتقل إلى صفحة SSL / TLS واضبط SSL على Flexible . يمكنك أيضًا ضبط إعدادات SSL على Full - ولكن قبل ضبط إعداد SSL على Full ، تأكد من أن موقع الويب الخاص بك يستخدم بالفعل SSL.

بمجرد إعداد SSL على موقع الويب الخاص بك ، انتقل إلى إعدادات شهادة Edge في SSL وقم بتنشيط " Always Use HTTPS" و " TLS 1.3 " وتمكين " إعادة كتابة HTTPS التلقائية."

لقد انتهينا الآن من إعداد SSL على موقعنا باستخدام SSL. بعد هذه الخطوة ، انقر فوق إعدادات السرعة ، ثم انقر فوق التحسين ضمن إعدادات السرعة .

بمجرد دخولك إلى صفحة التحسين في Speed ​​، قم بتمكين التصغير التلقائي لـ JavaScript و CSS و HTML.

ثم قم بتمكين ضغط Brotli على موقع الويب الخاص بك. Brotli هي خوارزمية ضغط طورتها Google وتقدم أفضل أداء لضغط النص.

فيما يلي بعض الميزات لاستخدام ضغط Brotli على موقع الويب الخاص بك ؛

بمجرد تمكين ضغط Brotli على موقع الويب الخاص بك ، يمكنك التمرير لأسفل إلى خيار Rocket Loader ثم تمكينه. بشكل افتراضي ، يتم تمكين هذا الإعداد ، ولكن في بعض الأحيان يتعارض هذا المكون الإضافي مع المكون الإضافي WP Rocket ويمكن أن يسبب مشاكل.

ننتقل الآن إلى إعدادات ذاكرة التخزين المؤقت في Cloudflare ثم نضبط مستوى التخزين المؤقت على " قياسي " وذاكرة التخزين المؤقت للمتصفح TTL على " سنة واحدة " على التوالي.

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

يمكنك معرفة المزيد حول الإعدادات الموصى بها هنا.

الآن أهم شيء هو إعداد قواعد الصفحة على مدونتنا باستخدام Cloudflare.

للقيام بذلك ، افتح إعدادات قواعد الصفحة في Cloudflare. باستخدام الخطة المجانية لـ Cloudflare ، يمكننا فقط إنشاء قواعد من 3 صفحات ، وإذا كنت ترغب في إنشاء أكثر من قواعد من 3 صفحات ، فيجب عليك شراء المزيد من قواعد الصفحة من Cloudflare.

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

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

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

قاعدة الصفحة الأولى لـ Cloudflare

لذا فإن القاعدة الأولى هي ؛

• URL : example.com/wp-login.php
• القاعدة (للاختيار من القائمة المنسدلة) : مستوى الأمان ثم حدد مرتفع أو أنا تحت الهجوم

مثال؛

استخدام هذه الصفحة القاعدة

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

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

حكم الصفحة الثانية لـ Cloudflare

القاعدة الثانية هي ؛

• URL : example.com/wp-admin/*
• القاعدة (للاختيار من القائمة المنسدلة) : تعطيل الأداء

مثال؛

استخدام هذه الصفحة القاعدة

أدت قاعدة الصفحة هذه إلى تعطيل الأداء داخل مجلد wp-admin. سيؤدي تعطيله إلى تعطيل Minification و Rocket Loader و Mirage و Polish على الجانب الخلفي من موقعك.

حكم الصفحة الثالثة لـ Cloudflare

القاعدة الثالثة هي ؛

• URL : example.com/wp-content/*
• القاعدة 1 : ذاكرة التخزين المؤقت للمتصفح TTL => عام
• القاعدة 2 : متصل دائمًا => تشغيل
• القاعدة 3 : مستوى ذاكرة التخزين المؤقت => تخزين كل شيء مؤقتًا
• القاعدة 4 : Edge Cache TTL => شهر

مثال؛

استخدام هذه الصفحة القاعدة

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

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

و Edge Cache TTL هو إعداد يتحكم في المدة التي ستقوم فيها خوادم Cloudflare بتخزين مورد مؤقتًا قبل طلب النسخة الحديثة.

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

وحتى الآن ، قمنا بمشاركة CDN واحد لتحسين الأداء العام لموقعنا على الويب. سنقوم الآن بمشاركة عدد قليل من شبكات CDN التي يمكنها العمل مع Cloudflare CDN.

4.2 استخدام ImageKit لتحسين الصورة

سنستخدم الآن ImageKit لتحسين صورنا في الوقت الفعلي. إنها إحدى شبكات CDN لتحسين وتحويل الصور في الوقت الفعلي التي تساعد موقع الويب على تقليل الحجم الفعلي للصور دون أن يكون لها أي تأثير فعلي على الجودة المرئية للصورة.

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

تقدم ImageKit ثلاثة أنواع من الأسعار لشبكة CDN ، ويمكنك اختيارها وفقًا لمتطلبات موقع الويب الخاص بك (أنا أستخدم الخطة المجانية للأبد على موقع الويب الخاص بي).

بمجرد اختيار السعر والتسجيل في نظامهم الأساسي ، يتعين عليك إنشاء نقطة نهاية . بمجرد إنشاء نقطة النهاية ، ستحصل على عنوان URL لـ CDN (تحقق من الصورة أدناه)

كما ترى ، لقد قمت بإنشاء عنوان URL CDN مستند إلى خادم الويب لاسم مجال TheGuideX . عنوان URL الخاص بي لـ CDN هو https://ik.imagekit.io/tgx/

بمجرد حصولنا على عنوان URL الخاص بـ ImageKit ، يتعين علينا تمكينه على موقع WordPress الخاص بنا. للقيام بذلك ، يتعين علينا فتح إعداد WP Rocket CDN من خلال زيارة لوحة إدارة WordPress> الإعدادات> WP Rocket> CDN ،

بمجرد دخولنا إلى صفحة CDN ، يتعين علينا تمكين CDN لموقعنا على الويب ، ثم في الحقل أدخل عنوان URL الخاص بـ ImageKit وفي إعداد " الحجز لـ" ، قم بتغييره إلى الصور.

بمجرد القيام بذلك ، يقوم WP Rocket بإعادة كتابة عنوان URL للصور من https://theguidex.com name إلى https://ik.imagekit.io/tgx. لذلك سيبدأ تحميل صورك من عنوان URL لـ CDN في الوقت الفعلي.

بمجرد إجراء هذه التغييرات ، سنقوم الآن ببعض تعديلات التحسينات في ImageKit لتحسين عمليات الضغط وتسليم الصور.

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

بمجرد دخولك إلى صفحة إعدادات الصورة ، يمكنك تخصيص الإعدادات وفقًا لاحتياجاتك.

هنا كما ترى ، قمت بتمكين " استخدام أفضل تنسيق لتسليم الصور" وكذلك تمكين جودة الصورة إلى 70٪.

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

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

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

هذه هي أهم الإعدادات لـ ImageKit ، ولكن يمكنك القيام بالكثير من الإعدادات من صفحة إعدادات الصورة الخاصة بهم.

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

سننتقل الآن إلى الجزء الثالث من استخدام CDN على موقعنا. وفي هذه الخطوة ، سنوضح لك كيفية تنفيذ Cloudfront واستخدامه على موقعنا على الويب لـ JS & CSS.

4.3 استخدم Amazon Cloudfront لـ JS و CSS

كما تعلم ، تعد Amazon CloudFront واحدة من أكثر شبكات CDN شيوعًا التي تحصل عليها على الإطلاق ، وتعتمد أكبر مواقع الويب في العالم على خدمة Amazon CloudFront CDN.

لديهم 61 خادمًا منتشرًا حول العالم ، قادرون على نقل صور المواقع وتسليمها بشكل أسرع في مواقع محددة.

أولاً ، انقر فوق " ابدأ مع Amazon Cloudfront" وقم بالتسجيل في موقع الويب الخاص بهم باستخدام معرف Amazon الحالي الخاص بك ، أو يمكنك أيضًا استخدام معرف بريد إلكتروني جديد للتسجيل في النظام الأساسي الخاص بهم.

بمجرد تسجيل الدخول إلى حساب Amazon AWS ، ابحث عن Cloudfront (يمكنك أيضًا النقر هنا لزيارة صفحة Cloudfront مباشرة) ثم انقر فوق " إنشاء التوزيع" ثم حدد موقع الويب وانقر على " البدء".

في اسم المجال الأصلي ، أدخل اسم المجال الخاص بك. في هذه الحالة ، اسم المجال الخاص بي هو https://theguidex.com ، لذلك أقوم بإدخال theguidex.com (بدون www أو https).

بجانبه ، عليك إدخال مسار الأصل ، وإدخال المسار إلى مجلد wp-content الخاص بك ، ثم تحديد TLSv1 في بروتوكول SSL وتحديد " Match Viewer" في بروتوكول الأصل.

الآن ، قم بالتمرير لأسفل إلى " إعدادات التوزيع" ، ثم حدد " استخدام جميع مواقع الحافة" في فئة الأسعار وقم بتعيين إعدادات CloudFront SSL الافتراضية.

يمكنك أيضًا تعيين إصدار S upported HTTP وتغييره إلى "HTTP / 2 و HTTP / 1.1 و HTTP / 1.0". بمجرد الانتهاء من هذه الإعدادات ، انقر فوق " إنشاء التوزيع".

انتقل مرة أخرى إلى صفحة توزيع Cloudfront وتحقق مما إذا تم تمكين التوزيع الخاص بك بشكل صحيح (سيظهر في نص اللون الأخضر ضمن قسم الحالة).

بمجرد تمكينه ، انقر فوق معرف المجال الأصلي الخاص بك.

عندما تنقر على معرّف التوزيع ، ستفتح صفحة مشابهة أعرضتها في الصورة أعلاه. انسخ اسم المجال (الموضح في المربع الأحمر) والصقه في قسم CDN في WP Rocket.

بمجرد لصق اسم المجال في WP Rocket ، حدد الاسم المحجوز لـ => " Javascript / CSS ."

لقد نجحت الآن في إعداد AWS Cloudfront على اسم المجال الخاص بك.

هذه الإعدادات كافية لموقع الويب الخاص بك لزيادة أدائه في Google PageSpeed ​​Insight و GTmetrix و Pingdom. يمكنك الآن أن ترى نموًا فوريًا في أداء موقع الويب الخاص بك.

ومع ذلك ، إذا لم تكن متأكدًا من كيفية زيادة سرعة موقع الويب الخاص بك ، أو كنت بحاجة إلى خدمة تحسين سرعة موقع الويب ، فيمكنك التواصل معي على البريد الإلكتروني [email protected] .

حتى الآن ، قمنا في الغالب بكل الأشياء الممكنة لتحسين سرعة موقعنا - ولكن إذا كنت مستخدمًا متقدمًا ، فأنا أشارك بعض الطرق الأخرى التي ستساعدك على زيادة سرعة موقع الويب الخاص بك.

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

الضبط الدقيق للووردبريس للسرعة (متقدم)

في طريقة تحسين سرعة WordPress هذه ، نحن نشارك بعض النصائح المتقدمة التي تعمل بشكل مذهل لتحسين سرعة موقع الويب الخاص بك.

1. استخدم أحدث إصدار من PHP

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

لماذا نستخدم أحدث إصدار من PHP؟

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

لذلك إذا كنت تستخدم أحدث إصدار من PHP على موقع الويب الخاص بك ، فيمكنك زيادة أداء موقع الويب الخاص بك. أحدث إصدار مستقر من PHP هو v7.4 ؛ حتى أنني أستخدم هذا الإصدار من PHP على هذا الموقع.

2. تحديد المراجعات اللاحقة

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

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

أضف هذا السطر من التعليمات البرمجية إلى ملف wp-config.php الخاص بك.

 حدد ('WP_POST_REVISIONS'، 4) ؛

3. قم بتعطيل Hotlinking و Leeching للمحتوى الخاص بك

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

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

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

 #disable hotlinking للصور بخيار الصورة المحظورة أو المخصصة
أعد كتابة المحرك على
RewriteCond٪ {HTTP_REFERER}! ^ $
RewriteCond٪ {HTTP_REFERER}! ^ http (s)؟: // (www \.)؟ theguidex.com [NC]
RewriteCond٪ {HTTP_REFERER}! ^ http (s)؟: // (www \.)؟ google.com [NC]
RewriteRule \. (jpg | jpeg | png | gif) $ - [NC، F، L] 

ملاحظة: لا تنس تغيير theguidex.com باسم المجال الخاص بك.

يمكنك أيضًا تعطيل موجز RSS إذا كنت لا تستخدمه على موقع الويب الخاص بك.

4. استخدم DNS Level Website Firewall

العامل الآخر الأكثر أهمية لتحسين السرعة هو استخدام جدار حماية موقع ويب على مستوى DNS. إذا كنت تتذكر ، فقد قمت بإنشاء قاعدة صفحة Cloudflare على theguidex.com/wp-login.php لزيادة أمان صفحة تسجيل الدخول الخاصة بي.

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

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

5. تقليل استدعاءات قاعدة البيانات

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

يمكن أن تؤدي هذه السمات إلى إبطاء موقع الويب الخاص بك وتقليله يمكن أن يقلل من مكالمات قاعدة البيانات ويزيد من الأداء العام لموقع الويب الخاص بك.

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

6. تقسيم التعليقات إلى صفحات

إذا تلقيت الكثير من التعليقات على مدونتك ، فأولًا وقبل كل شيء ، تهانينا! هذه علامة رائعة على بناء جمهور كبير.

لكن الجانب السلبي هو أن تحميل منشور بجميع التعليقات يمكن أن يبطئ السرعة.

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

7. فحص ضغط GZIP

يعد ضغط GZIP عاملاً آخر مهمًا لزيادة سرعة موقع الويب. إذا كنت تستخدم المكون الإضافي wp صاروخ على موقع الويب الخاص بك ، فإنه يقوم تلقائيًا بتمكينه لك.

يتم تمكين ضغط GZIP من جانب الخادم ، ويساعد في ضغط حجم ملفات HTML و JS و CSS. لن تعمل على الصور لأنها مضغوطة بالفعل بطريقة مختلفة.

يمكنك استخدام بعض الأدوات مثل Check GZIP Compression للتحقق مما إذا كان موقع الويب الخاص بك يستخدم GZIP أم لا.

إذا كان موقعك لا يستخدم GZIP ، فيمكنك استخدام هذا الرمز في ملف htaccess الخاص بك لتمكين GZIP على موقع الويب الخاص بك - ولكن تأكد من أنك تستخدم خادم apache على موقعك قبل استخدام هذا الرمز.

 # ضغط HTML و CSS و JavaScript والنص و XML والخطوط
  AddOutputFilterByType DEFLATE application / javascript
  AddOutputFilterByType DEFLATE application / rss + xml
  AddOutputFilterByType DEFLATE application / vnd.ms-fontobject
  AddOutputFilterByType DEFLATE application / x-font
  AddOutputFilterByType DEFLATE application / x-font-opentype
  AddOutputFilterByType DEFLATE application / x-font-otf
  AddOutputFilterByType DEFLATE application / x-font-truetype
  AddOutputFilterByType DEFLATE application / x-font-ttf
  AddOutputFilterByType DEFLATE application / x-javascript
  AddOutputFilterByType DEFLATE application / xhtml + xml
  AddOutputFilterByType DEFLATE application / xml
  AddOutputFilterByType DEFLATE الخط / النوع المفتوح
  AddOutputFilterByType DEFLATE الخط / otf
  AddOutputFilterByType DEFLATE الخط / ttf
  AddOutputFilterByType DEFLATE image / svg + xml
  AddOutputFilterByType DEFLATE image / x-icon
  AddOutputFilterByType DEFLATE text / css
  AddOutputFilterByType DEFLATE text / html
  AddOutputFilterByType DEFLATE text / javascript
  AddOutputFilterByType DEFLATE نص / عادي
  AddOutputFilterByType DEFLATE text / xml

  # إزالة أخطاء المتصفح (مطلوب فقط للمتصفحات القديمة حقًا)
  BrowserMatch ^ Mozilla / 4 gzip-only-text / html
  BrowserMatch ^ Mozilla / 4 \ .0 [678] no-gzip
  BrowserMatch \ bMSIE! no-gzip! gzip-only-text / html
  رأس إلحاق وكيل مستخدم متنوع

8. استخدم الجلب المسبق

الجلب المسبق للموارد هو أسلوب تحسين آخر رائع لزيادة أداء موقع الويب الخاص بك. يمكننا استخدامه لإخبار المتصفح بالأصول التي قد يحتاجها المستخدم في المستقبل - حتى قبل أن يحتاج إليها.

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

علي سبيل المثال،

 < link rel = " prefetch " href = " image.png " >

9. تقليل استخدام خطوط الويب

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

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

الان حان دورك

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

والآن حان الوقت لاستثمار ساعة في تحسين سرعة موقع WordPress الخاص بك.

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

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