قابلیت lazy Load چیست؟ ؛ راهنمای استفاده از لود تنبل در افزایش سرعت سایت

بی­‌شک یکی از مهم‌ترین فاکتورها برای هر وب‌سایتی، سرعت است که با تکنیک­‌های مختلفی می­‌توان آن را بهبود داد. یکی از راه های رایج برای افزایش سرعت سایت، خصوصا در سایت‌های فروشگاهی، استفاده از قابلیت Lazy load یا لود تنبل است. در این مقاله از فروشگاه ساز شاپفا با ما همراه باشید تا با لود تنبل، کاربردهای آن و چگونگی استفاده آشنا شوید.

قابلیت لود تنبل یا lazy loading چیست؟

به طور میانگین حدود 70 درصد از حجم هر صفحه از وب­‌سایت را ویدئوها و تصویرهای به کار رفته در آن صفحه به خود اختصاص می‌­دهند. این مساله می­‌تواند تاثیر زیادی در کاهش سرعت آن صفحه به­ هنگام لود شدن برای کاربر داشته باشد. آمارها نشان می­‌دهند که اگر نمایش سایت بیش از 3 ثانیه طول بکشد، حدود 53% از بازدیدکنندگان صبر نمی­‌کنند و صفحه را می­‌بندند. lazy load یکی از تکنیک‌های سئو است که در این مورد می‌­تواند به وب­‌سایت­‌ها کمک کند و علاوه­ بر کاهش حجم مصرفی از اشتراک، در نهایت موجب افزایش سرعت سایت شود.   

به­ عنوان مثال تصور کنید وارد یک صفحه از سایتی می­‌شوید که در انتهای آن یک ویدئو بارگذاری شده است. تکنیک lazy loading باعث می‌­شود تا زمانی که شما به پایین صفحه اسکرول نکرده‌­اید، ویدئو برای‌تان لود نشود و با سرعت بیشتری بتوانید محتوای مورد نیاز خود در آن صفحه را مشاهده کنید. در واقع استفاده از lazy loading باعث می­‌شود تا متن، تصاویر و ویدئوهای موجود در یک صفحه و به­ طور کلی منابعی که در صفحه قابل دیدن هستند، پس از اسکرول کردن به ترتیب برای ما دانلود شوند و سپس نمایش داده شوند.

تکنیک lazy load چه کاربردهایی دارد؟

همان­ طور که اشاره کردیم یکی از مهم‌ترین موارد در عملکرد سایت، سرعت آن است. علاوه بر کاربران، موتورهای جستجو نیز علاقه‌­ای به سایت‌­های کند ندارند. بنابراین حتی اگر چند ثانیه هم سرعت سایت‌مان از رقیب بهتر باشد، جایگاه مناسب‌تری نسبت به او خواهیم داشت.

 افزایش سرعت سایت در نهایت موجب بهبود تجربه کاربری و کاهش نرخ پرش سایت نیز می­‌شود. هم‌چنین دلیل دیگر استفاده از این تکنیک، تاثیر آن بر کاهش مصرف پهنای باند صفحه است زیرا تا زمانی که کاربر صفحه را اسکرول نکند، تصاویر و ویدئوها برای او دانلود نخواهند شد.

به این نکته هم توجه داشته باشید که کاهش مصرف پهنای باند موجب کاهش هزینه­ پرداخت و نگهداری سرور نیز خواهد شد.

یک مزیت دیگر استفاده از تکنیک lazy load این است که اگر در سایت خود برای نمایش محتوا به کاربر از جاوا اسکریپت استفاده کرده باشیم، باید این موضوع را در نظر داشته باشیم که درصورت استفاده از تصاویر زیاد، تا زمانی که تمام آنها بارگذاری نشده باشند، اجرای اسکریپت­‌ها به تعویض خواهد افتاد.

چگونه می‌­توان از قابلیت لود تنبل (lazy load) در سایت استفاده کرد؟

برای استفاده از این تکنیک در سایت­‌های وردپرس به­ خصوص برای کمک به سئو سایت فروشگاهی ، می­‌توانیم از چندین افزونه کمک بگیریم که عبارتند از :

• افزونه BJ Lazy Load
• افزونه Lazy Load by WP Rocket
• افزونه a3 Lazy Load
• افزونه Optimole
• افزونه Smush
• افزونه Lazy Loading XT

در ادامه امکانات هرکدام از این افزونه­‌ها برای قابلیت لیزی لود در سایت را شرح می­‌دهیم.

افزونه BJ Lazy Load

این افزونه که در CMS وردپرس به کار گرفته می‌­شود، یکی از بهترین گزینه‌­ها برای دستیابی به قابلیت Lazy loading به ­خصوص برای کسانی است که کمتر می­‌خواهند درگیر مدیریت وب­‌سایت و کار با آن شوند. نکته قابل توجه در مورد این پلاگین میزان رضایت کاربران از آن است، به ­گونه‌ای که اکثر استفاده­‌کنندگان به آن نظر مثبت داده‌­اند و نمره 4.1 از 5 را دریافت کرده است.

افزونه BJ Lazy Load قابلیت نصب آسانی دارد و کار کردن با آن نیز ساده و راحت است. یکی از ویژگی‌­های این افزونه این است که می‌توانید تعیین کنید کدام یک از ویدئوها و تصاویر موجود در وب­‌سایت از همان ابتدا دانلود شوند و به شکل lazy load لود نشوند.

اما از مهم‌ترین ویژگی­‌های این افزونه، قابلیت تصویر جایگزین است. به ­گونه‌­ای که از طریق آن می‌­توانید یک تصویر کم حجم در سایت آپلود کنید و تا زمانی که تصاویر موجود در هر صفحه برای کاربر در حالت لود نشده هستند، تصویر جایگزین را مشاهده کند.

افزونه Lazy Load by WP Rocket

این پلاگین یکی دیگر از ابزارهایی است که به شما این امکان را می­‌دهد تا زمانی که روی تصویری اسکرول نکرده‌­اید، نمایش داده نشود، هم‌چنین استفاده از آن نیز رایگان است. علاوه بر تصاویر سایر موارد موجود در صفحه همچون متن، آواتار و iFrame ها را نیز بررسی می­‌کند.

این افزونه قابلیت‌­های متعددی دارد که برخی از آن­ها عبارتند از: Gzip ، CDN، Object Cache، رابط کاربری ساده، هوشمند در درک مطلب و غیره.

افزونه a3 Lazy Load

با استفاده از افزونه a3 Lazy Load که تاکنون بیش از 200 هزار نصب فعال داشته، می­‌توانید بدون نیاز به تخصص خاصی به راحتی از قابلیت Lazy load در سایت خود استفاده کنید. هم‌چنین استفاده از آن نیز در وردپرس رایگان است.

از این افزونه می‌­توانید برای بارگذاری سریع‌­تر تصاویر، ویدئوها و iframeها استفاده کنید. اما نکته قابل توجه در خصوص این افزونه، سازگاری بالای آن با ووکامرس برای سایت‌های تجارت الکترونیک است.

افزونه Optimole

این افزونه رایگان امکان بهینه سازی 1GB تصاویر در ماه را به کاربران می‌­دهد و تاکنون بیش از 80 هزار نصب فعال داشته است.

این پلاگین ویژگی‌­های دیگری نیز دارد که برخی از آن­ها عبارتند از : پشتیبانی انواع تصاویر، امکان متمایز کردن برخی از تصاویر از لیزی لود، بهینه­‌سازی خودکار تصاویر، سازگاری با ویرایشگرهایی مانند المنتور.

افزونه Smush

شاید یکی از اصلی­‌ترین دلایل محبوبیت این افزونه برای دسترسی به لیزی لود، قابلیت استفاد آسان از آن باشد. هم‌چنین نسخه رایگان آن نیز تمام امکانات لازم برای بهینه‌سازی تصاویر را در اختیار شما قرار می­‌دهد، اگر نیاز به امکانات بیشتری داشتید می‌­توانید نسخه پرو آن را خریداری کنید.

افزونه Smush که تاکنون بیش از یک ملیون نصب فعال داشته، قابلیت­‌های متعددی را در اختیار ما قرار می­‌دهد که مهم‌­ترین آن­ها عبارتند از : امکان پشتیبانی از فایل­­‌های تصویری PNG و JPEG و هم‌چنین GIF، امکان تشخیص تصاویری که حجم زیادی دارند، بهینه‌سازی اتوماتیک درهنگام بارگذاری کردن، بهینه‌سازی تصاویری که حجم خیلی زیادی دارند، سازگاری با پروتکل HTTPS.

در نسخه پریمیوم این افزونه نیز امکان فشرده‌­سازی بالا، تغییر سایز تصاویر به صورت اتوماتیک و بهینه‌سازی نامحدود تصاویر وجود دارد.

افزونه Lazy Loading XT

با وجودی که این افزونه 5 سال است که به روزرسانی نشده و این یک نکته منفی در استفاده از پلاگین­‌ها است، اما تاکنون حدود 2000 نصب فعال داشته و اکثر استفاده‌کنندگان از آن راضی هستند. از مهم‌­ترین ویژگی­‌های این افزونه که باعث محبوبیت آن شده، این است که علاوه بر بهینه­‌سازی تصاویر کمک می‌کند تا کدهای css، html و جاوا اسکریپت را نیز فشرده‌­سازی کنید و از این طریق سرعت سایت را افزایش دهید.

با تکنیک لیزی لود، سئو سایت خود را بهبود ببخشید 

در این مقاله از بلاگ فروشگاه ساز شاپفا به این موضوع پرداختیم که تکنیک لیزی لود (lazy load) چیست؟ چه کاربردهایی دارد و چگونه می‌­توانیم از آن در وب­سایت استفاده کنیم تا سرعت سایت را افزایش دهیم و در نهایت رضایت کاربران را جلب کنیم. چند نمونه از پلاگین­‌های پرکاربرد که برای استفاده از این قابلیت به­ خصوص در هنگام راه اندازی فروشگاه اینترنتی به آن‌­ها نیاز خواهید داشت، معرفی کردیم.

 اگر تجربه‌­ای در زمینه استفاده از تکنیک لیزی لود دارید و یا سوالی درخصوص آن دارید می‌­توانید در بخش کامنت­‌ها، پیام خود را با ما و دیگران به اشتراک بگذارید. هم‌چنین اگر قصد طراحی یک سایت فروشگاهی جذاب برای کاربران‌تان با رعایت همه نکات مورد پسند گوگل را دارید، می­‌توانید با تیم متخصص و کاربلد شاپفا تماس بگیرید. کارشناسان ما پاسخگوی شما همراهان خواهند بود.