lazy load چیست
بهمن ۱۹, ۱۳۹۵

افزایش سرعت و کارآیی سایت با Lazy Load


سرعت لود شدن سایت نکته ای است که هم برای مدیر سایت و هم برای کاربر بسیار مهم است.از دید کاربر سایتی که سریع بارگذاری میشود دارای عملکرد بهتری است و  کاربر زودتر میتواند در آن سایت به خواسته خود برسد و از دید مدیر سایت هم این رضایت کاربران باعث افزایش فروش و در نتیجه سود دهی سایت خواهد شد.

یکی از مهم ترین عواملی که در سرعت سایت نقش دارند, تصاویر سایت هستند. بخشهای گرافیکی سایت که در طراحی آن و در میان مطالب استفاده میشوند تا ۷۰% حجم صفحات سایت را تشکیل میدهند.

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

در سالهای اخیر قابلیتی به نام Lazy Load به سایتها اضافه شده که تاثیرش در صرفه جویی از پهنای باند و افزایش سرعت سایت فوق العاده است.

در حالت عادی وقتی صفحه ای از سایتی برای شما نمایش داده میشود تمامی تصاویر سایت با هم در مروگر لود میشود که این باعث طولانی شدن زمان لود سایت و کاهش سرعت سایت میشود ولی با استفاده از Lazy load  تصاویر فقط در آن بخشی که کاربر میبیند نمایش داده میشود و با اسکرول کردن کاربر به سمت پایین کم کم باقی تصاویر هم لود میشوند

loading-spinner-lazy-load-small

توضیح عملکرد

در Lazy Load تصاویر سایت فقط زمانی لود میشوند که به آن نیاز باشد یعنی فقط در بخشی از سایت که کاربر میبیند. به عنوان مثال تصور کنید که سایت بزرگی  ۵ میلیون بازدید ماهیانه دارد و حجم تصاویر استفاده شده در آن ۷۵۰ کیلوبایت است در طول یک ماه ۲ میلیون از این بازدید ها فقط قسمت بالای سایت را میبینند و اصلا برای مطالعه مطالب به سمت پایین اسکرول نمیکنند پس دیگر آن تصاویر برای کاربر لود نمیشود و ۱٫۵ میلیون مگابایت در پهنای باند این سایت صرفه جویی میشود

پس میبینید که استفاده از Lazy load چه تاثیر شگفت انگیزی در صرفه جویی از پهنای باند مصرفی شما دارد.

نکات قبل از فعال سازی

قبل از اینکه بخواهید lazy load را در سایت خود فعال کنید باید به نکات زیر دقت کنید :

  • این قابلیت فقط زمانی کاربرد دارد که تعداد تصاویر سایت بسیار زیاد باشد و اگر سایت شما بیشتر متنی است و ۱ عکس در میان مطالب خود دارید نیازی نیست از لیزی لود استفاده کنید
  • lazy load یک قابلیت موجود در مرورگر ها نیست بلکه باید با استفاده از جاوا اسکریپت به صفحات سایت شما اضافه شود و نیاز به تخصص دارد
  • اشتباه انجام دادن مراحل فعال سازی لیزی لود ممکن است باعث شود تصاویر سایت اصلا به کاربر نمایش داده نشود
  • میتوانید برای محل قرار گیری تصاویر قبل از لود شدن رنگ بک گراند و انیمیشن در نظر بگیرید

ابزارهای مورد نیاز

اگر برنامه نویس هستید و با تکنیک های آن آشنا هستید میتوانید با استفاده از لایبریری lazysizes. قابلیت لیزی لود را برای سایت خود فعال کنید و اگر از سیستم مدیریت محتوی وردپرس استفاده میکنید میتوانید پلاگین رایگان WordPress plugin available استفاده کنید که فقط باید نصب و فعال شود.

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

حرف آخر

استفاده از Lazy Load میتواند هم برای مدیر سایت از نظر صرفه جویی بسیار زیاد در پهنای باند موثر باشد و هم برای کاربر از نظر افزایش سرعت سایت و بهبود تجربه کاربری موثر باشد. اگر قالب سایت شما از لیزی لود پشتیبانی نمیکند بهتر است همین امروز شروع به فعال سازی آن کنید.