كيفية تأخير تحميل البرنامج النصي في ووردبريس

نشرت: 2022-05-02

هل تبحث عن طريقة لتأخير تحميل البرنامج النصي في WordPress؟

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

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

الجانب السلبي لجافا سكريبت الجهة الخارجية المضافة هو أنه في معظم الحالات سيزيد من وقت تحميل الصفحة لكل عنوان URL يوجد عليه البرنامج النصي.

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

ربما لا تكون متأكدًا حتى مما إذا كان موقع الويب الخاص بك أسرع أو بطيئًا. ألق نظرة على الرابط أدناه لتزويدك ببعض المعلومات حول بعض أدوات اختبار سرعة الموقع المجانية التي يمكنك استخدامها لتحديد سرعة موقعك.
https://www.wpfixit.com/free-website-speed-testing-tools/

لا يبدو من العدل أن عليك أن تستبدل الوظائف بالسرعة ، أليس كذلك؟


البرامج النصية الخارجية مكلفة عند تحميل صفحة موقعك

نصوص الطرف الثالث موجودة في كل مكان. وفقًا لتقرير حالة JavaScript بواسطة أرشيف HTTP ، يبلغ متوسط ​​عدد البرامج النصية الخارجية المطلوبة من قبل مواقع الويب 20 ويبلغ حجمها الإجمالي حوالي 449 كيلوبايت .

تشتمل نسبة 93.59٪ الضخمة من صفحات الويب على مورد طرف ثالث على الأقل. يُظهر التعمق في نفس البيانات أن 76٪ من مواقع الويب تتعقب المستخدمين بنصوص التحليلات.

يتمثل أسوأ تأثير لنصوص الجهات الخارجية في تأخير مسار العرض الحرج ، بالإضافة إلى التأثير على نتائج Core Web Vitals ، بدءًا من درجة FID.

مسار العرض الحرج هو مجموعة الإجراءات التي يتخذها المتصفح لتجميع HTML و CSS وجافا سكريبت في موقع ويب حي وقابل للاستخدام.

بطبيعة الحال ، يلعب حجم الحمولة لنصوص الطرف الثالث دورًا رئيسيًا هنا ، ولكن هناك عامل مهم آخر يجب مراعاته.

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

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


البرامج النصية الخارجية الأكثر استخدامًا على WordPress

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

  1. تحليلات كوكل
  2. Facebook Pixel Code
  3. أدوات الدردشة الحية
  4. يتضمّن الفيديو
  5. النماذج المضمنة
  6. أدوات الوسائط الاجتماعية
  7. النماذج المضمنة

حقق العظمة عند تأخير تحميل البرنامج النصي في WordPress

لا يوجد سبب يدعو إلى التضحية بالسرعة من أجل الوظائف.

ماذا لو قلنا لك أنه يمكنك الحصول على كليهما؟

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

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

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

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

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

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

دعونا نلقي نظرة على الفرق في تحميل البرنامج النصي الخارجي العادي وتحميل برنامج نصي تأخير أدناه.


تحميل البرنامج النصي الخارجي المنتظم

تُظهر الصورة أدناه تحميل الشلال لعنوان URL الذي يحتوي على عنصر واجهة مستخدم TrustPilot المضمن فيه.

كما ترى في الصورة هناك 5 طلبات خارجية يتم تحميلها بهذه الصفحة. تأتي هذه الطلبات من البرنامج النصي الخارجي المضمن.

Delay Script Load in WordPress
سكريبت خارجي عادي مضمّن
WordPress Load Script 1
سكريبت خارجي عادي مضمّن

تأخير تحميل البرنامج النصي الخارجي

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

لا تزال أداة الشهادات TrustPilot مضمنة في الصفحة ولكننا حددنا وقتًا متأخرًا لتحميلها بعد 2.5 ثانية من تحميل الصفحة.

لم ينخفض ​​مبلغ الطلب فحسب ، بل ألق نظرة على وقت التحميل الكامل ووقت التحميل الذي انخفض أيضًا.

يبدو الأمر كما لو أن النص لم يكن موجودًا على الصفحة أثناء وقت التحميل.

WordPress Delay Load Script
نص خارجي مؤجل
WordPress Delay Load Script 1
نص خارجي مؤجل

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

تحميل البرنامج النصي الأصلي في WordPress

الكود أدناه هو النص الافتراضي المضمن لعنصر واجهة مستخدم TrustPilot الذي استخدمناه في اختبارات السرعة أعلاه.

 <!-- TrustBox script --> <script type="text/javascript" src="//widget.trustpilot.com/bootstrap/v5/tp.widget.bootstrap.min.js" async=""></script> <!-- End TrustBox script --> <!-- TrustBox widget - Carousel --> <div class="trustpilot-widget" data-locale="en-US" data-template- data-businessunit- data-style-height="140px" data-style-width="100%" data-theme="light" data-stars="1,2,3,4,5" data-review-languages="en"> <a href="https://www.trustpilot.com/review/wpfixit.com" target="_blank" rel="noopener">Trustpilot</a> </div> <!-- End TrustBox widget -->

تأخير تحميل البرنامج النصي في WordPress

الكود أدناه هو النص البرمجي المتأخر المضمن لعنصر واجهة مستخدم TrustPilot الذي استخدمناه في اختبارات السرعة أعلاه.

 <!-- TrustBox script --> <script> setTimeout(function() { var head_ID = document.getElementsByTagName("head")[0]; var script_element = document.createElement('script'); script_element.type = 'text/javascript'; // SET EXTERNAL SCRIPT PATH BELOW script_element.src = ' https://widget.trustpilot.com/bootstrap/v5/tp.widget.bootstrap.min.js "؛
    head_ID.appendChild (script_element) ،
} ، 2500 ) ؛ // تأخير الوقت يمكنك تعديله
</script>
<! - End TrustBox script ->

<! - أداة TrustBox - الرف الدائري ->
<div class = "trustpilot-widget" data-locale = "en-US" data-template- data-businessunit- data-style-height = "140px" data-style-width = "100٪" data-theme = " light "data-stars =" 1،2،3،4،5 "data-review-languages ​​=" en ">
</div>
<! - End TrustBox widget ->

أي استخدام لتأخير تحميل البرنامج النصي في ووردبريس

الكود أدناه هو القالب الافتراضي الذي يمكنك استخدامه لتأخير تحميل البرنامج النصي في WordPress.

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

  1. عنوان URL للبرنامج النصي الخارجي الذي تريد استخدامه
  2. التأخير الزمني عندما تريد تشغيل البرنامج النصي
 <script> setTimeout(function() { var head_ID = document.getElementsByTagName("head")[0]; var script_element = document.createElement('script'); script_element.type = 'text/javascript'; // SET EXTERNAL SCRIPT PATH BELOW script_element.src = ' URL_FOR_EXTERNAL_SCRIPT "؛
    head_ID.appendChild (script_element) ،
} ، 2500 ) ؛ // تأخير الوقت يمكنك تعديله
</script>

ختاماً

نأمل حقًا أن يكون هذا المنشور مفيدًا ويفهم كيفية تأخير تحميل البرنامج النصي في WordPress.

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

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