الصفحة الرئيسية
بلوجر
تسريع مدونة يلوجر

تأجيل الصور خارج الشاشة (Defer Offscreen images) بلوجر لتسريع مدونتك

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

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

كيفية تحميل الصورة الكسولة في Blogger: تأجيل الصور خارج الشاشة 2021

طريقة تركيب إضافة Lazy Load بلوجر

طريقة تركيب إضافة Lazy Load في بلوجر 

كيفية التحميل البطيء للصور في Blogger: (تأجيل الصور خارج الشاشة)

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

التحميل البطيىء Lazy Load

  أفضل طريقة لتحسين السرعة هي استخدام تنسيقات الصور مثل JPEG 2000 و JPEG XR و WebP plus أيضًا في تنفيذ التحميل البطيء على Blogger.

شرح تأجيل الصور خارج الشاشة بلوجر 

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

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


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

  1. فيما يلي خطوات تمكين التحميل البطيء في مدونتك . 
  2. ادهب الى لوحة تحكم من مدونتك 
  3.  اضغط على المظهر 
  4. ثم بعد دلك اضغط على تعديل المظهر 
  5.  في محرر HTML ، انقر فوق ctrl + F ، وابحث </ body> أو مرر لأسفل حتى النهاية ستجد علامة </body> هذه.
  6. الصق الكود التالي فوق </ body>  وقم بالحفظ

<script>
//<![CDATA[
// Lazy Load
(function(a){a.fn.lazyload=function(b){var c={threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window};if(b){a.extend(c,b)}var d=this;if("scroll"==c.event){a(c.container).bind("scroll",function(b){var e=0;d.each(function(){if(a.abovethetop(this,c)||a.leftofbegin(this,c)){}else if(!a.belowthefold(this,c)&&!a.rightoffold(this,c)){a(this).trigger("appear")}else{if(e++>c.failurelimit){return false}}});var f=a.grep(d,function(a){return!a.loaded});d=a(f)})}this.each(function(){var b=this;if(undefined==a(b).attr("original")){a(b).attr("original",a(b).attr("src"))}if("scroll"!=c.event||undefined==a(b).attr("src")||c.placeholder==a(b).attr("src")||a.abovethetop(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.rightoffold(b,c)){if(c.placeholder){a(b).attr("src",c.placeholder)}else{a(b).removeAttr("src")}b.loaded=false}else{b.loaded=true}a(b).one("appear",function(){if(!this.loaded){a("<img />").bind("load",function(){a(b).hide().attr("src",a(b).attr("original"))[c.effect](c.effectspeed);b.loaded=true}).attr("src",a(b).attr("original"))}});if("scroll"!=c.event){a(b).bind(c.event,function(c){if(!b.loaded){a(b).trigger("appear")}})}});a(c.container).trigger(c.event);return this};a.belowthefold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).height()+a(window).scrollTop()}else{var d=a(c.container).offset().top+a(c.container).height()}return d<=a(b).offset().top-c.threshold};a.rightoffold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).width()+a(window).scrollLeft()}else{var d=a(c.container).offset().left+a(c.container).width()}return d<=a(b).offset().left-c.threshold};a.abovethetop=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollTop()}else{var d=a(c.container).offset().top}return d>=a(b).offset().top+c.threshold+a(b).height()};a.leftofbegin=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollLeft()}else{var d=a(c.container).offset().left}return d>=a(b).offset().left+c.threshold+a(b).width()};a.extend(a.expr[":"],{"below-the-fold":"$.belowthefold(a, {threshold : 0, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : 0, container: window})","right-of-fold":"$.rightoffold(a, {threshold : 0, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : 0, container: window})"})})(jQuery);$(function(){$("img").lazyload({placeholder:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuaQTYFSJ02B2VUsf2WknqpKuUWZr1Ky6ZoWnHmQpFbqy8FAB4bRKtYBXmJUSSzhR-LgaQOpxP5Tb0Of2grSCu2LGGJ4PwX5McvZGTqte19z2E57hij_yFuewQ7TXwChzzULspCQdogdI/s10/loadingku.gif",effect:"fadeIn",threshold:"-50"})});
//]]>
</script>

.لقد قمت الآن بتحديث البرنامج النصي فيمدونتك  واكتمل التنفيذ. الآن  يمكنك التحقق من سرعة موقع الويب والجوانب الأخرى في Google Page Speed Insight. سيظهر في عمليات التدقيق إذا تم تنفيذ التحميل البطيء بشكل صحيح أم لا. في لقطة الشاشة أدناه ، اجتاز موقع الويب الخاص بي عملية التدقيق على التحميل البطيء المعروف أيضًا باسم Defer offscreen images.

اقرأ أيضا:

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

إرسال تعليق