كلما زاد عدد طلبات HTTP إلى موقعك ، كان تحميله أبطأ. لذلك إذا كان بإمكانك تقليل عدد طلبات HTTP وتحسين طريقة تحميلها ، يمكنك تحسين أداء موقع الويب الخاص بك .
في هذا المنشور ، سنطلعك على كل ما تحتاج لمعرفته حول كيفية إنشاء عدد أقل من طلبات HTTP على وورد بريس.
سنبدأ بمقدمة أساسية لطلبات HTTP ، وسبب أهميتها ، وكيفية تحليل طلبات موقع وورد بريس الخاص بك.
بعد ذلك ، سنشارك بعض النصائح والاستراتيجيات التي يمكنك تنفيذها لتقليل طلبات موقعك. بالإضافة إلى مساعدتك في رسالة “جعل عدد أقل من طلبات HTTP” في GTmetrix ، ستساعد هذه الإستراتيجيات أيضًا في رسالة “تجنب تسلسل الطلبات الحرجة” في Google PageSpeed Insights.
عند إنشاء موقع ويب ، فإنه يحتوي على الكثير من الأجزاء المختلفة. لديك ملفات الصور المختلفة التي تستخدمها على الصفحة ، وأوراق أنماط CSS التي تتحكم في شكل المحتوى ، وملفات JavaScript التي تضيف كل تلك الوظائف الرائعة ، وما إلى ذلك.
عندما يزور شخص ما موقع الويب الخاص بك ، يحتاج متصفحه إلى وسيلة لتنزيل جميع الموارد المطلوبة لتلك الصفحة من خادمك. للقيام بذلك ، فإنه يجعل طلبات HTTP إلى الخادم لكل مورد فردي.
على سبيل المثال ، قد يقول ، “مرحبًا الخادم ، أحتاج إلى ملف coolimage.png ” و “مرحبًا الخادم ، أحتاج أيضًا إلى ورقة أنماط CSS لهذا المكون الإضافي لنموذج الاتصال “. ثم يستجيب الخادم لتلك الطلبات بالملفات المعنية.
بمجرد حصول متصفح الويب على هذه الملفات ، يمكنه تجميع صفحة الويب للزائر الخاص بك. بالطبع ، الأمر أكثر تعقيدًا من ذلك بقليل ، لكن هذه هي الفكرة الأساسية.
HTTP ، اختصارًا لبروتوكول Hypertext Transfer Protocol ، هو كيفية اتصال أجهزة الكمبيوتر هذه (متصفح الزائر وخادم الويب الخاص بك).
شيء واحد مهم يجب فهمه هو أن كل عنصر منفصل هو طلب HTTP منفصل. على سبيل المثال ، إذا كان لديك خمسة ملفات صور على صفحة ويب ، فإن المتصفح يحتاج إلى إجراء خمسة طلبات HTTP منفصلة ، واحد لكل صورة.
وبالمثل ، إذا كنت تستخدم أربعة مكونات إضافية لبرنامج وورد بريس ويضيف كل مكون إضافي ورقة أنماط CSS الخاصة به ، فسيحتاج متصفح الزائر إلى إجراء أربعة طلبات HTTP منفصلة ، واحدة لكل ورقة أنماط لكل مكون إضافي.
لماذا من المهم تقليل طلبات HTTP
بشكل عام ، كلما زاد عدد طلبات HTTP على موقع الويب الخاص بك ، كان تحميله أبطأ . لذلك إذا كنت ترغب في جعل موقع الويب الخاص بك يتم تحميله بشكل أسرع ، فأنت بحاجة إلى تحسين وتقليل عدد طلبات HTTP التي يتطلبها موقعك.
بينما يعد هذا نوعًا من التبسيط ، فإن الفكرة الأساسية هي أن متصفح الويب سيعرض موقع الويب فقط للزائر بمجرد الانتهاء من تنزيل جميع طلبات HTTP (على الرغم من وجود بعض التكتيكات لإخبار المتصفح بأنه لا بأس من الانتظار لبعض الوقت الملفات).
لذلك إذا كان على موقع الويب إجراء 70 طلب HTTP قبل أن يتمكن من عرض الصفحة ، فسيستغرق ذلك وقتًا أطول مما لو كان عليه إجراء 40 طلب HTTP.
بالإضافة إلى ذلك ، فإن بعض طلبات HTTP “تمنع” طلبات HTTP الأخرى ، مما يعني أن المتصفح لا يمكنه بدء تنزيل طلبات HTTP معينة حتى ينتهي من تنزيل طلبات HTTP قبله.
خلاصة القول هي: عندما تقوم بإجراء عدد أقل من طلبات HTTP ، فإنك تجعل موقع الويب الخاص بك يتم تحميله بشكل أسرع .
أعلاه ، لقد تعلمت أن كل الأشياء متساوية ، فإن تقليل عدد طلبات HTTP سيؤدي إلى تسريع موقعك . ومع ذلك ، فإن جميع طلبات HTTP ليست دائمًا “متساوية”. بعض طلبات HTTP أكبر من غيرها. بعضها أبطأ من البعض الآخر.
على سبيل المثال ، سيستغرق طلب ملف صورة ضخم بحجم 3 ميغابايت وقتًا أطول بكثير من طلب صورة صغيرة بحجم 20 كيلوبايت.
إذا كنت ترغب في إجراء أكبر تحسين على موقعك ، فإن التركيز على طلبات HTTP الكبيرة بطيئة التحميل أولاً سيحقق أكبر عائد على استثمارك.
لتحليل طلبات HTTP الخاصة بموقعك ، يمكنك استخدام شيء يسمى تحليل الشلال .
تقدم معظم أدوات اختبار السرعة هذا ، لكن الواجهات في GTMetrix و Pingdom مريحة للغاية. يمكنك أيضًا استخدام أدوات مطور المستعرض الخاص بك. ومع ذلك ، سنستخدم GTmetrix للحصول على لقطات الشاشة الخاصة بنا.
بمجرد توصيل عنوان URL الخاص بك ، سترى مربع ملخص أساسي في الأعلى. يوضح لك هذا عدد طلبات HTTP التي يشتمل عليها موقعك ، ولكنه لا يقسم الطلبات الفردية:
مثال على نتائج gtmetrix لموقع ويب اختباري
لتحليل طلباتك الفردية ، انتقل إلى علامة التبويب الشلال أدناه.
هنا ، سترى قائمة بكل طلب HTTP فردي على موقعك مع معلومات حول المدة التي استغرقها طلب HTTP للتنزيل:
مثال على مخطط الشلال من gtmetrix
يمكنك أن ترى كيف أن جميع طلبات HTTP ليست متساوية. على سبيل المثال ، تأخذ صورة 839.3 كيلوبايت 1.12 ثانية بينما أخذت الصورة 57.6 كيلوبايت 87.5 مللي ثانية فقط:
طلبات http في gtmetrix
يمكنك أيضًا العثور على طلبات HTTP من مكونات وورد بريس الإضافية المختلفة التي تستخدمها من خلال البحث عن اسم مجلد المكون الإضافي على الخادم الخاص بك. على سبيل المثال ، يمكنك أن ترى أن WooCommerce تضيف سبعة من طلبات HTTP الخاصة بها:
البحث عن طلبات woocommerce في gtmetrix
بهذه الطريقة ، يمكنك معرفة ما إذا كانت أي مكونات إضافية تستخدمها تضيف الكثير من طلبات HTTP (خاصة طلبات التحميل البطيء).
على مستوى عالٍ ، هناك استراتيجيتان عريضتان لتقديم طلبات HTTP أقل:
قم بإزالة طلبات HTTP. إذا كان ذلك ممكنًا ، يجب عليك إزالة كل طلب HTTP غير ضروري تمامًا. على سبيل المثال ، إذا كان لديك مكون إضافي لا يضيف أي قيمة إلى موقعك ويقوم بتحميل CSS و JavaScript الخاصين به ، فما عليك سوى إزالة هذا المكون الإضافي تمامًا للتخلص من جميع طلبات HTTP الخاصة به.
ادمج طلبات HTTP. إذا كانت لديك طلبات HTTP يجب عليك تحميلها مطلقًا ، فيمكنك دمجها في ملف واحد. على سبيل المثال ، بدلاً من ستة ملفات CSS صغيرة ، يمكنك دمجها في ملف CSS واحد أكبر ، والذي سيستمر في التحميل بشكل أسرع لأن المتصفح يحتاج إلى تقديم طلبات أقل (هذا ليس صحيحًا دائمًا مع HTTP / 2 ، وهو ما سنقوم به ناقش أدناه).
سنبدأ بالتكتيكات التي تركز على إزالة طلبات HTTP ثم ندخل في كيفية دمج طلبات HTTP المتبقية. الفكرة الأساسية هي إزالة ما تستطيع ثم دمج كل ما تبقى.
للبدء ، ستحتاج إلى استخدام تحليل الشلال لسحب جميع الطلبات من المكونات الإضافية الخاصة بك. يمكنك القيام بذلك من خلال البحث عن “المكونات الإضافية” ، والتي ستسحب كل طلب HTTP ينشأ من مجلد wp-content / plugins .
إذا قمت بالتمرير فوق اسم الملف ، فيمكنك معرفة المكون الإضافي الذي يأتي منه. على سبيل المثال ، يمكنك هنا رؤية طلب من المكون الإضافي شريط التمرير الذي قد تستخدمه.
قد تظهر بعض عمليات البحث الإضافية أن Slider Revolution تضيف ثلاثة من طلبات HTTP الخاصة بها ، على الرغم من أن صفحة الاختبار هذه لا تحتوي على أي منزلقات:
البحث عن الإضافات في gtmetrix
كيف ترى من أين يأتي طلب HTTP
إذا كنت تستخدم Slider Revolution لشريط تمرير رئيسي ، فربما تحتاج إلى الاحتفاظ به. ولكن إذا قمت بتثبيته لاختباره ، فحينئذٍ أزل شريط التمرير ، وأنت الآن لا تستخدمه بالفعل … ثم يجب عليك إزالته للتخلص من طلبات HTTP هذه.
في الأساس ، تريد تصفح القائمة بأكملها واسأل نفسك عما إذا كان كل مكون إضافي يضيف قيمة فعلاً إلى موقعك. إذا لم يكن المكون الإضافي (ولكنه يضيف طلبات HTTP) ، فمن الأفضل لك إزالته.
بمجرد قطع أي مكونات إضافية غير ضرورية ، فإن الخطوة التالية هي معرفة ما إذا كان بإمكانك استبدال أي مكونات إضافية تستخدمها ببدائل خفيفة الوزن.
على سبيل المثال ، لنفترض أنك تريد إضافة أزرار المشاركة الاجتماعية إلى موقعك . هذه ميزة جيدة ، لكن بعض المكونات الإضافية للمشاركة الاجتماعية يمكن أن تضيف الكثير من طلبات HTTP.
على سبيل المثال ، يضيف المكون الإضافي AddThis الشهير ستة من طلبات HTTP الخاصة به (بما في ذلك بعض الطلبات الخارجية – المزيد عن تلك في ثانية):
ابحث عن AddThis plugin الذي يعرض ستة من طلبات HTTP الخاصة به
يمكنك تقليم الكثير من هذه الدهون باستخدام بديل أفضل مثل NovaShare أو Grow by MediaVine .
في هذه المرحلة ، يجب عليك إزالة جميع المكونات الإضافية غير المطلوبة في أي مكان على موقعك. ومع ذلك ، هناك فئة أخرى من المكونات الإضافية التي قد تسبب مشاكل – المكونات الإضافية المطلوبة فقط في أجزاء معينة من موقعك ولكن يتم تحميل البرامج النصية الخاصة بها في كل مكان.
على سبيل المثال ، استخدم المكون الإضافي الشهير Contact Form 7 . ربما تحتاج فقط إلى هذا المكون الإضافي في صفحتين (على سبيل المثال صفحة “اتصل بنا”). ومع ذلك ، يقوم نموذج الاتصال 7 بتحميل البرامج النصية الخاصة به في كل صفحة من صفحات موقعك. لذلك ، على سبيل المثال ، لا يزال نموذج جهة الاتصال 7 يضيف بعض طلبات HTTP إلى منشورات مدونتك على الرغم من أن منشورات مدونتك لا تحتوي على أي نماذج اتصال.
مثال آخر يمكن أن يكون WooCommerce إذا كنت تستخدمه فقط كمعالج دفع . سيستمر WooCommerce في تحميل البرامج النصية الخاصة به في كل مكان ، على الرغم من أنك تحتاجها فقط في عربة التسوق وصفحات الخروج لحالة الاستخدام هذه.
التكتيك المتقدم هنا هو تحميل الإضافات بشكل مشروط عند الحاجة فقط. على سبيل المثال ، يمكنك السماح بتحميل نموذج الاتصال 7 على صفحة “اتصل بنا” ، ولكن يمكنك تعطيله في أي مكان آخر.
إذا لم تكن مطورًا ، فيمكنك استخدام مكونات إضافية مثل Asset CleanUp أو Perfmatters للقيام بذلك بدون رمز. باستخدام Perfmatters ، ستحتاج أولاً إلى تمكين مدير البرنامج النصي. بعد ذلك ، يمكنك فتح مدير البرامج النصية لعرض جميع البرامج النصية التي يتم تحميلها على الصفحة وتعطيل أي نص غير مطلوب:
تمت إدارة البرنامج النصي في المكون الإضافي Perfmatters
مدير البرنامج النصي في المكون الإضافي Perfmatters
كن حذرًا لأنك قد تتسبب في حدوث مشكلات إذا عطلت بطريق الخطأ برنامجًا نصيًا مطلوبًا بالفعل . في حين أن هذا تكتيك مفيد ، فهو أيضًا تكتيك متقدم.
إذا كنت لا تشعر بالثقة ، فقد ترغب في تخطي هذه الخطوة أو تعيين مطور لمساعدتك.
إذا تم استخدام الصور بشكل جيد ، فإنها تجعل موقع الويب الخاص بك أكثر سهولة في الاستخدام وجاذبية. يضيفون قيمة إلى موقعك.
تريد أن تعرف كيف زدنا من حركة المرور لدينا أكثر من 1000 ٪؟
انضم إلى أكثر من 20000 آخرين ممن يتلقون رسائلنا الإخبارية الأسبوعية مع نصائح من الداخل حول وورد بريس!
إشترك الآن
ومع ذلك ، فإن كل صورة على موقعك هي طلب HTTP منفصل. لذلك إذا كانت لديك صور لا تضيف قيمة ، فمن الأفضل إزالتها لإزالة طلبات HTTP هذه.
على سبيل المثال ، هل هذا GIF المضحك يستحق كل هذا العناء؟ قد يكون … ولكنه قد لا يكون كذلك – تحتاج إلى التفكير في المفاضلات عندما تضيف المزيد من الصور إلى المحتوى الخاص بك .
أخيرًا ، تأكد من تغيير حجم الصور المتبقية وضغطها . على الرغم من أن هذا لن يقلل من عدد طلبات HTTP في حد ذاته ، إلا أنه سيقلل من حجم طلبات HTTP ، مما يجعل تحميلها أسرع.
مع تحميل كسول، سوف موقعك الانتظار لتحميل تحت الطية الصور و أشرطة الفيديو ، و نوافذ الأطر المدمجة حتى يبدأ المستخدم التمرير لأسفل.
نظرًا لأن هذه الموارد لا يتم تحميلها على الفور ، فلا داعي لتقديم طلب HTTP للتحميل الأولي للصفحة.
اعتبارًا من الإصدار 5.5 من وورد بريس ، يتضمن وورد بريس الآن تحميلًا كسولًا أصليًا للصور باستخدام سمة تحميل HTML . بالنسبة لبعض الطرق الأخرى لتنفيذ التحميل البطيء (بما في ذلك ملفات الفيديو) ، يمكنك الاطلاع على دليلنا الكامل للتحميل البطيء لـ وورد بريس .
تعد الخطوط المخصصة رائعة لتحسين التصميم وتجربة المستخدم على موقعك. ومع ذلك ، يجب أن تكون حذرًا في كيفية استخدامها لأن كل نوع خط مخصص تستخدمه يضيف طلب HTTP آخر.
إذا كنت ستستخدم خطوطًا مخصصة ، فتأكد من الالتزام برقم صغير. هل تحتاج حقًا إلى خط مختلف لعنوان المنشور وجسم المنشور الخاص بك؟ أو هل يمكنك استخدام نفس الخط؟ هل تحتاج حقًا إلى أوزان الخطوط الخمسة؟ أم يمكنك فقط اختيار اثنين؟
وينطبق الشيء نفسه على خطوط الرموز مثل Font Awesome و IcoMoon. يمكن أن تكون خطوط الرموز مفيدة ، ولكن ربما لا تحتاج إلى تحميل مكتبات خطوط رموز متعددة. من الأفضل اختيار مكتبة خطوط رمز واحدة فقط والتمسك بذلك.
أخيرًا ، إذا كنت تريد الذهاب إلى أبعد من ذلك والتخلص تمامًا من طلبات HTTP المتعلقة بخطوط موقعك ، فيمكنك التفكير في استخدام مكدس خطوط النظام. في حين أن هذا سيمنحك مرونة أقل من حيث التصميم ، إلا أنه يعني أيضًا أن زوار موقعك لن يضطروا إلى تحميل أي ملفات خط لمجرد عرض موقعك.
(مقترح قراءة: كيفية تغيير الخطوط في وورد بريس ).
بشكل افتراضي ، يضيف وورد بريس طلب HTTP الخاص به للرموز التعبيرية. على الرغم من أنه طلب HTTP واحد بحجم 5.1 كيلوبايت ، إلا أن هذا الملف كان لفترة طويلة بمثابة شوكة في جانب عشاق أداء وورد بريس. هنا في Kinsta ، نحب أداء وورد بريس ، ولهذا السبب لدينا دليل كامل حول كيفية تعطيل وورد بريس emojis .
أبسط خيار هو تثبيت وتنشيط المكون الإضافي المجاني Disable Emojis (متوافق مع القانون العام لحماية البيانات) . ومع ذلك ، يمكنك قراءة دليلنا الكامل لبعض الخيارات الأخرى.
بعد القيام بذلك ، سينخفض عدد طلبات HTTP بمقدار واحد ولا يزال بإمكانك استخدام الرموز التعبيرية 😃
حتى الآن ، ركزنا بشكل أساسي على تقليل طلبات HTTP للملفات على خادم موقع وورد بريس الخاص بك. ومع ذلك ، قد تحتاج متصفحات زوارك أيضًا إلى طلب ملفات من خوادم الجهات الخارجية.
يمكن أن تكون هذه الطلبات أكثر إزعاجًا لأن موقعك تحت رحمة سرعة خوادم الطرف الثالث .
بعض الأمثلة:
Google Analytics – تتم استضافة نص التتبع على خوادم Google ، ولكن لا تزال متصفحات الزوار بحاجة إلى تنزيل هذا الملف.
مقاطع فيديو YouTube المضمنة – سترى الكثير من طلبات HTTP إلى خوادم YouTube.
خدمات إعلانات الجهات الخارجية – سترى الكثير من طلبات الجهات الخارجية المتعلقة بخدمة إعلاناتك.
خطوط Google (على شبكة CDN الخاصة بـ Google) – سترى طلبات الجهات الخارجية لخوادم Google لتحميل ملفات الخطوط الخاصة بك.
يمكنك تطبيق العديد من الأساليب نفسها من الأعلى على طلبات HTTP التابعة لجهات خارجية.
هل تحتاج إلى حل استضافة يمنحك ميزة تنافسية؟ لقد جعلك Kinsta مغطى بسرعة لا تصدق وأحدث مستويات الأمان والتوسع التلقائي. تحقق من خططنا
على سبيل المثال ، إذا أضاف مكون إضافي طلبات الطرف الثالث الخاصة به (مثل إضافة AddThis أعلاه) ، يمكنك إزالته واستخدام شيء أكثر تحسينًا.
بالنسبة لمقاطع فيديو YouTube ، يمكنك تحميلها كسول واستبدال تحميل الصفحة الأولية بصورة مصغرة. سيؤدي هذا إلى تأخير إضافة طلبات HTTP هذه حتى يرغب الزائر في تشغيل الفيديو.
بالنسبة إلى البرامج النصية للجهات الخارجية الضرورية ، مثل Google Analytics أو Facebook Pixel ، يمكنك تجربة استضافة تلك البرامج النصية محليًا.
يحتوي WP Rocket على وظائف إضافية مدمجة لاستضافة Google Analytics و Facebook Pixel محليًا أو يمكنك استخدام مكون إضافي مثل CAOS (Complete Analytics Optimization Suite) .
لدينا أيضًا بعض الأدلة التي قد تساعد:
كيفية استضافة الخطوط محليا
كيفية استضافة Google Analytics محليًا
في هذه المرحلة ، كان من المفترض أن تكون قادرًا على تقديم عدد أقل من طلبات HTTP من موقعك. حان الوقت الآن للدخول في كيفية دمج طلبات HTTP المتبقية ، بدءًا من الصور.
هناك طريقة أخرى لتحسين الصور على موقعك وهي دمج الصور المنفصلة في ملف صورة واحد. بعد ذلك ، يمكنك استخدام CSS لعرض جزء فقط من ملف الصورة عند الحاجة. هذا تكتيك يسمى CSS sprites .
تعمل رموز CSS بشكل أفضل مع الصور الزخرفية مثل اختلافات الشعار أو الرموز. يجب عدم استخدام رموز CSS للصور المعلوماتية (مثل الصور الموجودة في نص منشور مدونة) لأن هناك عيبين كبيرين:
تحسين محركات البحث – نظرًا لأنك تجمع الصور في ملف صورة واحد ، فلا يمكنك ترتيب الصور الفردية في بحث Google .
إمكانية الوصول – نظرًا لأنه لا يمكنك إضافة نص بديل إلى الصور ، فلن يتمكن الأشخاص الذين لديهم برامج قراءة الشاشة من فهم الصور المحملة بنقوش CSS (على الرغم من وجود بعض الأساليب لإصلاح ذلك).
إذا كنت لا تزال في حيرة من أمرك بشأن هذا الموضوع ، فإليك مثالاً لملف CSS sprite من Amazon – يمكنك أن ترى كيف يتضمن مجموعة من اختلافات الشعار ، بالإضافة إلى بعض الرموز. تستخدم Amazon CSS للتأكد من أن “الجزء” ذي الصلة فقط من ملف الصورة يتم عرضه في كل موقع:
مثال على CSS sprites من أمازون. يمكنك استخدام CSS “لاستهداف” جزء معين فقط من الصورة المدمجة.
مثال على CSS sprites من أمازون. يمكنك استخدام CSS “لاستهداف” جزء معين فقط من الصورة المدمجة.
لسوء الحظ ، لا يوجد مكون وورد بريس الإضافي “اضبطه ونسيانه” لـ CSS sprites. ومع ذلك ، يمكنك العثور على أدوات للمساعدة ، مثل أداة CSS Sprite هذه :
قم بتحميل الصور التي تريد دمجها في الأداة.
ستمنحك الأداة بعد ذلك ملف صورة مدمجًا ، جنبًا إلى جنب مع بعض كود CSS لكل صورة قمت بتحميلها.
قم بتحميل ملف الصورة المدمج إلى موقع وورد بريس الخاص بك.
استخدم كود CSS لعرض الصورة في المحتوى الخاص بك. سيحدد CSS المقدم تلقائيًا الجزء المناسب فقط من ملف الصورة المدمج.
بين سمة وورد بريس والمكونات الإضافية الخاصة بك ، من المحتمل أن يقوم موقعك بتحميل عدة أوراق أنماط CSS وملفات JavaScript ، مما يعني طلبات HTTP متعددة فقط للمتصفح لتنزيل CSS و JavaScript التي يحتاجها لعرض الصفحة.
لتقليل كل هذه الطلبات المنفصلة ، يمكنك دمج هذه الملفات / أوراق الأنماط المنفصلة في ملف / ورقة أنماط واحدة. وهذا ما يسمى مجموعة الملفات أو سلسلة الملفات ، بناءً على الأداة التي تستخدمها.
تتضمن العديد من ملحقات التخزين المؤقت في وورد بريس ميزات لدمج ملفات CSS و JavaScript. على سبيل المثال ، يتيح لك WP Rocket ، الذي يمكنك استخدامه في Kinsta ، تمكين كليهما ببضع نقرات.
انتقل إلى علامة التبويب File Optimization في إعدادات WP Rocket. بعد ذلك ، قم بتمكين التصغير ثم ادمج الملفات:
كيفية دمج CSS و JavaScript في WP Rocket
كيفية دمج CSS و JavaScript في WP Rocket
للحصول على نظرة أكثر تفصيلاً ، تحقق من دليل WP Rocket الكامل .
يمكنك أيضًا استخدام Autoptimize لدمج ملفات CSS و JavaScript. لدمج الملفات ، انتقل إلى الإعدادات ← تحسين تلقائي واختر الخيارات من أجل:
تجميع ملفات JS
تجميع ملفات CSS
للحصول على نظرة أكثر تفصيلاً ، تحقق من البرنامج التعليمي الكامل للتحسين التلقائي .
تكون فوائد دمج الملفات أقل وضوحًا مع HTTP / 2 ، وهو ما يستخدمه موقعك إذا كنت تستضيفه في Kinsta . تم تصميم HTTP / 2 ليكون أكثر كفاءة في نقل ملفات صغيرة متعددة ، مما يعني أن هناك فرقًا أقل بين ملف CSS / JS كبير واحد وملفات صغيرة متعددة.
بشكل أساسي ، إذا كنت تستضيف في Kinsta ، فقد لا تحتاج إلى القيام بهذه الخطوة لإجراء تحسينات على أوقات تحميل صفحتك. نوصي بمواصلة اختباره لأنه لا يزال من الممكن أن يكون مفيدًا لبعض المواقع ، ولكن قد لا تلاحظ أيضًا أي اختلاف في أوقات تحميل الصفحة الحقيقية.
ومع ذلك ، لا تزال العديد من أدوات اختبار الأداء مثل GTmetrix لا تتعرف على HTTP / 2 ، لذلك قد تستمر GTmetrix في عرض رسالة “جعل عدد طلبات HTTP أقل” وتقليل درجاتك. تذكر ، بالرغم من ذلك – لا تهم النتائج بقدر أهمية أوقات تحميل الصفحة الحقيقية .
لا يؤدي تأجيل حظر عرض JavaScript إلى القضاء على طلبات HTTP في حد ذاتها. ومع ذلك ، فهي تعمل على تحسين كيفية تحميلها ، والتي يمكن أن يكون لها نفس التأثير على أوقات التحميل المتصورة لموقعك.
يمكن أن يساعد أيضًا في رسالة “تجنب تسلسل الطلبات الحرجة” في Google PageSpeed Insights / Lighthouse.
من خلال تأجيل الطلبات لملفات معينة أو تحميلها بشكل غير متزامن ، يمكنك منع بعض الموارد غير المهمة من “حظر” الموارد اللازمة لتحميل الجزء المرئي من موقعك بسرعة.
لمزيد من المعلومات حول سبب حدوث ذلك ، يمكنك قراءة دليلنا حول فهم مسار العرض الحرج لصفحة الويب.
بعد ذلك ، يمكنك اتباع دليلنا التفصيلي للتخلص من موارد حظر العرض على وورد بريس.
إذا كنت تبحث عن بعض مكونات وورد بريس الإضافية “الكل في واحد” لتقديم طلبات HTTP أقل ، فنحن نوصي باثنين من المكونات الإضافية من البرنامج التعليمي أعلاه:
صاروخ الفسفور الابيض
بيرفيماترز
بينما ستظل بحاجة إلى تقييم السمة والمكونات الإضافية يدويًا لمعرفة ما إذا كانت تقدم طلبات HTTP كثيرة جدًا ، يمكن أن تساعدك هاتان المكوّنات الإضافية في تحسين كل شيء يبقى على موقعك بمجرد الانتهاء من التنظيف.
المزيد من طلبات HTTP = وقت تحميل أبطأ للموقع. ⏳ كسر هذه الدائرة بهذا الدليل لتقليل طلباتك
انقر للتغريد
يضيف كل مورد منفصل على موقعك طلب HTTP. صورة واحدة هي طلب HTTP واحد ، ورقة أنماط CSS واحدة هي طلب HTTP واحد ، ملف خط واحد هو طلب HTTP واحد ، وهكذا.
إذا كنت تستخدم وورد بريس ، فسيقوم المظهر الخاص بك بالتأكيد بإضافة طلبات HTTP الخاصة به والعديد من المكونات الإضافية تضيف أيضًا طلبات HTTP الخاصة بها. سيكون لديك أيضًا طلبات HTTP من أي صور تستخدمها والنصوص البرمجية لجهات خارجية التي تضيفها (مثل أدوات التحليلات ).
ستؤدي طلبات HTTP الأكبر و / أو الأكبر إلى موقع ويب أبطأ. هذا هو السبب في أنك سترى بشكل شائع رسائل مثل “إنشاء عدد أقل من طلبات HTTP” أو “تحسين طلبات HTTP” أو “تجنب تسلسل الطلبات الحرجة” عند استخدام أدوات اختبار السرعة مثل GTmetrix أو PageSpeed Insights.
لتقليل عدد طلبات HTTP على موقعك ، يمكنك اتباع الخطوات الموضحة أعلاه.
