في تدوينة سريعة أود ان أناقش معكم حل لمشكلة مكتبة الجي كويري - اليوم أقدم لكم حل جزري لمشكلة بطئ تحميل قوالب بلوجر بسبب مكتبة jquery، عندما تقوم بإختبار سرعة موقعك علي Google page speed insight تتفاجئ بمجموعة من مسببات بطئ قوالب بلوجر و علي رأسها مكتبة الجي كويري كالمثال أدناه.


تسريع مكتبة مكتبة الجي كويري

يكمن الحل في أستخدام السمة  async أو defer لفهم الية عمل هذه السمات بإمكانك قراة كامل التفاصيل علي موسوعة حسوب 


ولكن المشكلة تكمن في أن ليس من الممكن أستخدام هذه السمات علي مكتبة جيكوير لإنه ببساطة لن يعمل أي سكريبت مبني علي مكتبة جي كويري


كقاعدة عامة في البرمجة، يجب وضع ملفات js في الجزء السفلي قبل علامة إغلاق الوسم </body> حتى لا يتم تحميل الأسكربتات في بداية تحميل الصفحة، لكن هذا لا يكفي. يقوم الوسم   async أو defer بتأخير وانتظر حتى تنتهي الصفحة من التحميل).


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


لذلك سنشرح معكم الطريقة الصحيحة لإضافة السمات   async أو defer بالشكل الصحيح حتي تعمل مكتبة jquery، الطريقة التي أطرحها معكم تقوم بتقوم بتأجيل تحميل مكتبة الجي كويري لحين تحميل الصفحة بالكامل، تابع الشرح 


<body>
<script defer = "defer" src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" />
<script> // <! [CDATA [
window . addEventListener ( 'load' , function () {
  // Code jquery
})
//]]> </script>
</body>

لاحظ أنه عند إضافة السمة غير   async أو defer لأول مرة إلى وسم مكتبة jquery.js ، لن تعمل بعض الأسكرتات المكتوبة بـ jquery لأنها تبدأعادةً بـ 




<script>

  //<![CDATA[

$(document).ready(function(){})



$(function(){})



$(window).bind('load',function(){})



$(window).scroll(function(){})



$('element').each(function(){})



$('element').click(function(){})



...

//]]></script>

ولحل هذه المشكلة نقوم بوضع window.addEventListener ('load', function () {}) في أي سكريبت مبني علي مكتبة جي كويري كالتال. 


<script>//<![CDATA[

window.addEventListener('load',function(){

  $(document).ready(function(){})

  $(function(){})

  $(window).bind('load',function(){})

  $(window).scroll(function(){})

  $('element').each(function(){})

  $('element').click(function(){})

  ...

})

//]]></script>

وبذلك ستقلل من ثقل مكتبة الجي كويري المتسبب الرئيسي في بطئ تحميل قوالب بلوجر، أي سؤال ضعه في قم التعليقات.

اقرأ أيضًا: