شرح كيفية تمكين التحميل البطيئ على موقع بلوجر. [محدث]

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

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

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

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

لذلك يمكنك اتباع بعض الأساليب لتحسين سرعة موقع الويب الخاص بك باستخدام تنسيقات الصور مثل .webp و JPG 2000 ويمكنك أيضًا تنفيذ lazyload على موقع ويب blogger للحصول على تجربة مستخدم وسرعة أفضل.

ما هو التحميل البطيء؟

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

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

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

خطوات لتمكين lazyload على المدون:

اتبع الخطوات أدناه لإضافة نص برمجي lazyload للمدونين. سيتم تطبيق التحميل البطيء على جميع الصور تلقائيًا. ليست هناك حاجة لإضافة العلامات المضمنة <img> يدويًا.

انتقل إلى لوحة تحكم Blogger وانقر فوق قسم السمة.

ثم انقر فوق تحرير HTML من القائمة المنسدلة.

في محرر HTML ، انقر فوق ctrl + F وابحث عن </body> أو قم بالتمرير لأسفل حتى النهاية ستجد علامة </body> هذه.

الصق كود جافا سكريبت أعلى علامة </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://3.bp.blogspot.com/-xtM_7x0_cU4/XIok1BisovI/AAAAAAAAPUc/QGJpBJZ3QBM_Spkd9r3-SMurEUbRI1pOQCLcBGAs/s10/loadingku.gif",effect:"fadeIn",threshold:"-50"})});
//]]>
</script>

لقد نجحت الآن في تنفيذ التحميل البطيء للصور على موقع blogger.

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

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

تعديل المقال