همشه تاخیر در بارگذاری صفحات یک وبسایت باعث نارضایتی مخاطب میشود، روشهای متفاوتی برای سرعت بخشیدن به بارگذاری یک صفحه وب وجود دارد یکی از راههای پیش روی شما برای افزایش سرعت لود صفحات وب استفاده از تکنیک لیزی لود است.
Lazy Load به وبسایت اجازه میدهد تنها زمانی که کاربر به تصویر میرسد آن را بارگذاری کند در اینصورت زمان بارگذاری وبسایت کاهش پیدا میکند و به عملکرد صفحه وب بهبود میبخشد. اکثر سایتهای بزرگ که تصاویر سنگینی دارند از Lazy Load برای افزایش سرعت و عملکرد استفاده میکنند. بارگذاری هرچه سریعتر یک وبسایت تجربه کاربری بهتری را به همراه خواهد داشت پس بهتر است این مسئله را نادیده نگیرید. در این مقاله بررسی خواهیم کرد که Lazy Load چیست؟ و چطور در سایت وردپرسی از آن استفاده نماییم .
چگونه سرعت بارگذاری سایت را افزایش دهیم
انتخاب یک هاست مناسب برای میزبانی یک سایت یکی از عواملی است که میتواند بر سرعت سایت تاثیر داشته باشد، هاست وردپرس به گونهای کانفیگ شده است که سایت جهت بارگذاری صفحات وب از منابع کافی برخوردار باشد و بیشرین سازگاری را با وبسایت های وردپرسی داشته باشد.
یکی دیگر از راههای افزایش سرعت بارگذاری استفاده از سرویس CDN است، یک CDN به کاربر این امکان را میدهد که تصاویر را از نزدیکترین سرور دانلود کند و سرعت بارگذاری وب سایت را افزایش دهد. اگر نیاز به کسب اطلاعات بیشتر در زمینه CDN دارید میتوانید مقاله CDN چیست ؟ با مزایا و معایب سی دی ان آشنا شوید را مطالعه فرمایید. در صورتی که از CDN استفاده میکنید، تصاویر همچنان به صورت عادی بارگذاری میشوند اما این کار بر زمان بارگذاری کلی صفحه تأثیر مثبت دارد. از دیگر مواردی که میتوان برای افزایش سرعت لود سایت از آن استفاده کرد استفاده از افزونههای Lazy load در وردپرس است در ادامه افزونههای لیزی لود را معرفی خواهیم کرد.
چرا از Lazy Load در وردپرس استفاده میکنیم؟
Lazy Load در وردپرس این امکان را فراهم میکند که سرعت وب سایت افزایش پیدا کند و تجربه کاربری بهتری به مخاطب ارائه شود، هیچکس وبسایت های کند را دوست ندارد و معمولا کاربرها برای بارگذاری وبسایت صبر چندانی نخواهند کرد. مطالعه رفتار کاربران وبسایت ها نشان داده است که یک ثانیه تاخیر در زمان بارگذاری صفحه منجر به 7 تا 11 درصد بازدید کمتر از صفحه و 16٪ کاهش رضایت مشتری میشود.
موتورهای جستجو مانند گوگل نیز از وبسایت هایی که بارگذاری آنها آهسته است نیز خوششان نمیآید و تاثیر منفی در سئو سایت دارد به همین دلیل است که سایت هایی با سرعت بارگذاری مناسب در نتایج جستجو رتبه بالاتری دارند. تصاویر در مقایسه با سایر عناصر وب بیشترین زمان را برای بارگذاری در وب سایت نیاز دارند، اگر تصاویر زیادی در صفحات وب استفاده کنید، هر تصویر تاثیر بالایی در زمان بارگذاری صفحه خواهد گذاشت.
روش کار Lazy Load برای تصاویر
لیزی لود به جای اینکه همه تصاویر را به طور همزمان بارگذاری کند، فقط تصاویر قابل مشاهده در صفحه کاربر را فراخوانی میکند و تصاویر دیگر را با یک متن تصویر یا فضای خالی جایگزین نمایش میدهد، هنگامی که کاربر به بخش پایینتر اسکرول میکند وب سایت تصاویری را بارگیری میکند که در ناحیه مشاهده کاربر نمایش داده میشود. Lazy Load میتواند برای وبسایت و همینطور وبلاگ بسیار مفید باشد تا زمان بارگذاری برای لود صفحات بسیار کاهش پیدا کند بنابراین کاربران سایت را سریع تر مشاهده میکنند.
اگر میخواهید از Lazy Load برای بارگذاری تصاویر و یا پسزمینه استفاده کنید، لازم است در سایت وردپرسی خود یک افزونه لیزی لود نصب کنید، با اینکه Lazy Load به بهبود سرعت بارگذاری وب سایت کمک میکند اما همیشه تصاویر را قبل از آپلود در وردپرس فشرده کنید تا حجم آنها به حداقل برسد میتوانید لیستی از بهترین افزونه های بهینه سازی تصاویر وردپرس را مطالعه فرمایید.
در ادامه دو افزونه وردپرس Lazy Load را معرفی خواهیم کرد، در صورتی که جهت نصب افزونه به راهنمایی نیاز دارید میتوانید مقاله آموزش نصب افزونه در وردپرس را مطالعه فرمایید.
روش1 : بارگذاری Lazy Load در وردپرس با LiteSpeed Cache
از افزونههای کاربردی برای Lazy Load میتوان به LiteSpeed Cache اشاره کرد یک پلاگین شتاب دهنده که دارای یک کش انحصاری در سطح سرور و مجموعهای از ویژگی ها برای بهینه سازی بهتر است. افزونه LiteSpeed Cache در بهبود روند بهینه سازی سایت کمک خواهد کرد. لایت اسپید یک افزونه غیر رایگان است اما در صورتی که وب سرور شما LiteSpeed باشد میتوانید از افزونه لایت اسپید کش بصورت رایگان استفاده کنید.
از ویژگی های افزونه لایت اسپید کش میتوان به موارد زیر اشاره کرد:
- حافظه پنهان CDN QUIC.cloud
- پشتیبانی از Object Cache (Memcached/LSMCD/Redis)
- بهینه سازی تصویر (Lossless/Lossy)
- Minify CSS, JavaScript, and HTML
- Combine CSS/JS
- تولید خودکار CSS Critical
- Lazy-load images/iframes
- Responsive Image Placeholders
- پشتیبانی Multiple CDN
- بارگیری CSS به صورت Asynchronously
- Defer/delay JS loading
- پشتیبانی از کش مرورگر
- پاک کننده و بهینه ساز پایگاه داده
- رابط کاربری جذاب و قابل درک
- پشتیبانی از فرمت تصویر WebP
- کنترل Heartbeat
روش2 : بارگذاری Lazy Load در وردپرس با Autoptimize
Autoptimize یک افزونه کاربردی است که بهینه سازی سایت را بسیار آسان میکند، این افزونه اسکریپت ها را minify و تصاویر را بهینه میکند، از lazy load پشتیبانی میکند و عملکرد سایت را بهبود میبخشد، افزونه Autoptimize داری API های گستردهای است که میتوانید با توجه به نیاز وب سایتتان از آنها استفاده کنید.
در این مقاله به معرفی دو افزونه قدرتمند وردپرس پرداختیم البته افزونه ها برای lazy load بسیار زیاد هستند، سعی کنید یکی از این افزونه ها را در وردپرس داشته باشید. اگر مبتدی هستید و هنوز در ابتدای راه برای راهاندازی یک وبسایت هستید میتوانید آموزش نصب وردپرس فارسی را مشاهده کنید، همینطور آموزش نصب قالب وردپرس را در نظر گرفتیم تا در سهولت کامل سایتتان را راهاندازی کنید.