خوش آمدید!

برای دریافت آخرین بروزرسانی‌های افزونه، استایل و ... نیازمند ثبت‌نام در انجمن می‌باشید تا با ما بروز بمانید!

ثبت نام!
آموزشهای وردپرس

WALKER

مدیر کل انجمن
تاریخ ثبت‌نام
11/13/18
نوشته‌ها
6,138
پسندها
5,574
امتیازها
113
محل سکونت
tehran
آنتی ویروس
پیاده سازی لود تنبل برای تصاویر و ویدیوها

به طور کلی میانگین حجم صفحات وب سایت‌ها به همراه تصاویر و ویدیوها 3376 کیلوبایت می‌باشد که بالای ۷۰ درصد آن راHTTP Archive اشغال می‌کند. این مقدار حجم در مرورگر‌ بازدیدکنندگان وب سایت برای مشاهده و دانلود بسیار زیاد است و این حجم با پیشرفت وب سایت و افزایش مقالات و تصاویر بیشتر نیز می‌شود و این افزایش در کاهش سرعت و کاهش رتبه سئو تاثیرگذار است.

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

اینجا ، جایی است که لود تنبل (Lazy Load) وارد صحنه می‌شود. لود تنبل یک تکنیک بهینه‌سازی صفحات وب سایت است که توسط آن هنگام ورود به یک صفحه وب تنها اطلاعات قابل مشاهده لود می‌شود و بقیه اطلاعاتی که در زیر وجود دارند ، پس از اسکرول کردن شروع به لود شدن می‌کنند.

لود تنبل یا Lazy Load یکی از اقداماتی است که گوگل در صورت مشاهده بسیار هیجان زده می‌شود و به وب سایت شما اهمیت می‌دهد و همچنین از این تکنیک در وب سایت‌هایی که مقالات و صفحات تعداد زیادی از ویدیوهای embed شده و تصاویر با رزولوشن بالا را در خود جای داده‌اند، به اجبار باید استفاده کرد.

لود تنبل چگونه کار می‌کند؟

لود تنبل به شکل زیر کار می‌کند :

  • مرورگر صفحات وب را به صورت DOM در می‌آورد که در این مدل هنگام لود صفحه، تصاویر و ویدیوها لود نمی‌شوند.
  • جاوااسکریپت با تکنیکی به نام Determine تصاویر و ویدیوها را براساس محتوایی که پس از لود صفحه مشاهده می‌شود، دانلود و نمایش می‌دهد. تصاویر و ویدیوهایی که در پایین صفحه هستند نیز به همین ترتیب پس از اسکرول دانلود و نمایش داده می‌شوند.
  • دانلود و نمایش فایل‌های اضافی را تا زمانی که کاربر به محل مشخص فایل ویدیویی اسکرول نکند ، به تاخیر می‌اندازد و سپس بعد از اسکرول تمامی فایل‌های مشخص شده برای لود تنبل آن قسمت لود می‌شوند.
نتیجه نهایی آن شد که تصاویر در لود اولیه، دانلود نمی‌شوند و همچنین ویدیوها تا زمانی که نیاز نباشد لود نمی‌شوند. این‌کار می‌تواند بهبود قابل توجهی در عملکرد وب سایت‌هایی که تصاویر با رزولوشن بالا و ویدیوهای embed شده در خود جای داده‌اند، ایجاد کند و در نتیجه باعث بهبود سرعت سایت شود اگر از تصاویر حجیم در وب سایتتان استفاده می‌کنید ، لود تنبلبه سرعت لود صفحه شما خیلی کمک می‌کند.

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

پس از بررسی 12 افزونه مربوط به لود تنبل و فعال کردن و تست چندین باره ، ما 4 افزونه خیلی حرفه ای را که بهبود قابل ملاحظه ای در عملکرد وب سایت شما ایجاد می‌کنند را شناسایی کردیم و قصد داریم در ادامه معرفی کنیم ولی قبل از آن به سوالی پاسخ دهیم:

آیا تصاویر و ویدیو‌ها واقعا در کاهش سرعت سایت موثر هستند ؟
قصد داریم با یک ارزشیابی کوچک، تاثیر تصاویر و ویدیوها را بر سرعت سایت به شما نمایش دهیم. برای نمایش ارزشیابی، تصمیم گرفتیم که روی هاست میزفا ، یک وردپرس نصب کنیم. پوسته 2016 وردپرس که بدون هیچ افزونه بهینه سازی و تکنیک ذخیره کش و… در وردپرس موجود بود را فعال کردیم. تصویر زیر نمایانگر نتایج آنالیز و بررسی ارزشیابی سئو و سرعت سایت در ابزار آنلاین pingdom قبل از اضافه کردن تصاویر و ویدیو می‌باشد.

بهبود سرعت لود صفحه از طریق افزونه‌های لود تنبل

همانطور که درحال امتحان افزونه‌های لود تنبل هستید ، قبل و بعد از فعالسازی میزان تغییرات را بررسی کنید تا با این کار میزان رضایت خود را بسنجید و اطمینان یابید که به آن‌ سرعتی که در نظر داشتید رسیده‌اید.

1 – BJ Lazy Load

BJ Lazy Load-Lazy Load WP Plugin


افزونه BJ Lazy Load یک افزونه کاربردی و حرفه‌ای برای وردپرس است که به شما در زمینه افزایش سرعت بارگذاری وردپرس کمک می‌کند و با استفاده از آن قادر به ایجاد حالت بارگذاری (Lazy Load) خواهید بود… در واقع اساس کار این افزونه به این صورت است، که محتوای سایت شما را با اسکرول کردن کاربران در صفحه، بارگذاری می‌کند… یا به عبارتی از قابلیت Lazy Load برای افزایش سرعت بارگذاری سایت استفاده می‌کند. این افزونه کاربردی در مخزن وردپرس به ثبت رسیده است و توانسته از میان +۷۰,۰۰۰ نصب فعال، امتیاز ۲/۴ از ۵ را به خود اختصاص دهد.

2-AJAX Load More-Ultimate Infinite Scroll Plugin

WordPress Infinite Scroll – Ajax Load More

Load Ajax Load بیشتر به عنوان "پلاگین وردپرس بی نهایت اسکرول" شناخته می شود که مخصوص موارد بارگذاری تنبل است مانند مواردی مانند: پست ها، صفحات، نظرات و غیره با استفاده از پرس و جوی های AJAX. با استفاده از این افزونه شما قادر خواهید بود با استفاده از بارکد آژاکس سازنده کوتاه تر، سفارشی را برای شما به نمایش بگذارید.

سپس فقط با استفاده از ویرایشگر محتوا یا فقط به طور مستقیم آن را به فایل های قالب خود اضافه کنید. پلاگین بار AJAX دارای سازگاری چندگانه است که عالی است زیرا شما می توانید قالب تکرار را در تمام سایت های شبکه خود مدیریت کنید. همچنین افزونه های موجود در این افزونه نیز وجود دارد که قابلیت های بیشتری را نیز ارائه می دهد.

ویژگی های بیشتر AJAX Load More:
فیلتر آژاکس
چند نمونه
پارامترهای پرس و جو
تنظیم پانل
سازنده کوتاه

3-Lazy Load-Lazy Load WP Rocket Plugin

Lazy Load by WP Rocket

بعد از پلاگین وردپرس Lazy Load پلاگین دیگری است که به نام Lazy Load ایجاد شده توسط WP Rocket است. این افزونه تصاویر و یا فریم های تصویر را بر روی یک صفحه نشان می دهد زمانی که برای کاربر قابل مشاهده باشد. مزیت انجام این کار این است که تعداد مکانیسم درخواست HTTP را کاهش می دهد و زمان بارگذاری را بهبود می بخشد.

افزونه Lazy Load برای موارد مختلف مانند: ریز عکسها، همه تصاویر در محتوا پست شما یا در متن ویجت، شکلک ها، آواتار ها و iframes ها کار می کند. هیچ کتابخانه Javascript مانند جی کوئری وجود ندارد، که استفاده می شود و اسکریپت این افزونه کمتر از 10 کیلوبایت است. شما همچنین می توانید جایگزین یوتیوب یاهو با یک تصویر پیش نمایش پیش فرض که به منظور افزایش زمان بارگذاری سایت وردپرس شما کار خواهد کرد.

WP YouTube Lyte-4
WP YouTube Lyte


با پلاگین WP YouTube Lyte شما می توانید فیلم ها را در سایت خود بارگذاری کنید با قرار دادن Lite YouTube Embeds پاسخگو. این به نظر می رسد مانند ویدیوهای یوتیوب جاسازی شده طبیعی، اما زمانی که آنها را کلیک کنید آنها در واقع کاهش در حجم دانلود. شما می توانید پلاگین این پلاگین را پیکربندی کنید تا ریز عکسها یوتیوب را به صورت محلی ذخیره کند که هر دو عملکرد و حریم خصوصی را بهبود می بخشد.

شما همچنین می توانید یک لینک یوتیوب برای یک ویدیو یا یک لیست کامل از لیست را با استفاده از httpv به جای http اضافه کنید. علاوه بر این، شما همچنین می توانید یک ویجت Lyte را به نوار کناری و WP YouTube Lyte اضافه کنید و سپس آن لینک را با کد بهینه سازی عملکرد درست تغییر دهید. چند کد کوتاه نیز برای استفاده شما وجود دارد. این پلاگین به طور کامل پاسخگو است بنابراین بدون توجه به نوع دستگاهی که کاربر شما برای دسترسی به سایت شما دارد، این پلاگین می تواند متناسب با اندازه صفحه نمایش آن فرمت شود.

5-Advanced Lazy Load-Speed Up Your Site
Advanced Lazy Load-Speed Up Your Site

و ما با افزونه WordPress Advanced Lazy Load پنج پلاگین WordPress Lazy Load را به شماره 5 اضافه کردیم. این افزونه برای ایجاد سرعت وب سایت WP شما ایجاد شد. این کار چیزهایی مانند بارگیری تصویر در بارگذاری صفحات طولانی سایت شما را به نمایش می گذارد و تصاویری که در خارج از منظره یاب قرار گرفته اند بارگیری نمی شوند تا زمانی که کاربر به آنها کپی نکند.

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

ویژگی های بیشتر افزونه Lazy Load پیشرفته عبارتند از:
شما می توانید صفحات و URL های خاص را از بین ببرید
قادر به پخش کلاس تصویر است
روشن و خاموش بار تنبل برای دستگاه های تلفن همراه

Lazy Load XT-Free WP Plugin-6

Lazy Load XT-Free WP Plugin

ما به سراغ افزونه Lazy Load XT WP برویم، که یکی دیگر از پلاگین های رایگان است. با استفاده از این افزونه، شما می توانید تصاویر بارگذاری تنبل در سایت خود و همچنین ویدیوهای YouTube و Vimeo و iframes را داشته باشید. Plugin Lazy Load XT، یکی از سریعترین و سبک ترین افزونه های بارگذاری تنبل در دایرکتوری پلاگین وردپرس است.

این نیز به طور کامل برای کسانی که مایل به داشتن چیزهایی دقیقا همان طوری که می خواهید قابل تنظیم است. چگونه افزونه Lazy Load XT کار می کند این است که با بارگیری اسکریپت Lazy Load XT و سپس جایگزین کردن ویژگی های src با data-src زمانی که محتوای یک پست یا صفحه در انتهای جلوی سایت وردپرسی شما قرار می گیرد.

a3 Lazy Load-Mobile Oriented Lazy Load Plugin-7

a3 Lazy Load-Mobile Oriented Lazy Load Plugin

پلاگین وردپرس A3 Lazy Load عالی است این است که آن را به تلفن همراه گرا است، بنابراین آن را برای کار اضافی در دستگاه های تلفن همراه طراحی شده است. این فوق العاده آسان است برای استفاده از افزونه که سرعت بار صفحه سایت WP شما را افزایش می دهد. این یکی از پلاگین های WP بارگذاری انعطاف پذیر است که در دسترس هستند بنابراین شما می دانید که برای چیزی عالی هستید. با رفتن به تنظیمات مدیریت شما می توانید تصمیم بگیرید که کدام موارد پس از تبدیل شدن به کاربران سایت شما قابل مشاهده خواهند بود.

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


Images Lazyload and Slideshow-Free Lazy Load Plugin-8
Images Lazyload and Slideshow-Free Lazy Load Plugin

و آخرین چیزی که ما به WP Images و Lazy Load Slideshow افزوده ایم. این افزونه برای چند مورد قابل استفاده است. یکی از چیزهایی هست که می توان آن را برای تصاویر بارگیری تنبل در یک کل سایت استفاده کرد. به این ترتیب هر تصویر یک بار تنبل برای کمک به بهبود سرعت وب سایت شما خواهد بود. شما همچنین می توانید یک اثر سبد یا یک اثر نمایش اسلاید گالری را به تصاویر خاصی که شما سفارشی را انتخاب می کنید اضافه کنید.

و در نهایت یک تنظیمات HTML سفارشی وجود دارد، بنابراین شما می توانید HTML ها مانند CSS سفارشی برای تصاویر، کدهای ردیابی و غیره را ذخیره کنید. هر یک از این ویژگی ها می توانند مستقل از یکدیگر عمل کنند، بنابراین اگر فقط بخواهید از یکی از آنها استفاده کنید، هیچ مشکلی نیست. افزونه Lazy Load Load و Slideshow تصاویر همچنین دارای سه اثر مادری: prettyPhoto، fancybox و slimbox2 است.
 
ارسال کننده موضوعات مشابه انجمن پاسخ ها تاریخ
afshin171 درخواست بالابردن سرعت لود سایت وردپرس 12
WALKER آموزش بهبود و افزایش سرعت لود سایت با 14 تکنیک کلیدی آموزشهای وردپرس 0
sslri دانلود بهینه سازی تصاویر وردپرس Webcraftic Robin image optimizer PRO v1.4.3 افزونه های وردپرس 0
sslri دانلود سئو و بهینه سازی خودکار تصاویر در وردپرس PB SEO Friendly Images Pro افزونه های وردپرس 0
WALKER افزونه تغییر سایز همه تصاویر ضمیمه - Resize attachments all افزونه های زنفورو 1
MiladIT دانلود دانلود reSmush.it Image Optimizer | برترین افزونه بهینه سازی و کاهش حجم تصاویر PNG,JPG,GIF افزونه های وردپرس 0
WALKER دانلود Smart Content Protector - Pro WP Copy Protection v8.1 افزونه جلوگیری از کپی متن و تصاویر در وردپرس افزونه های وردپرس 1
WALKER دانلود Justified Image Grid - Premium WordPress Gallery v4.0.1 | افزونه ایجاد گالری تصاویر پیشرفته در وردپرس افزونه های وردپرس 4
WALKER دانلود Multipurpose Before After Slider v2.7.1 افزونه نمایش قبل و بعد از تغییر تصاویر برای وردپرس افزونه های وردپرس 0
WALKER دانلود Instagram Feed v4.0.0 - WordPress Instagram Gallery افزونه نمایش تصاویر اینستاگرام در وردپرس افزونه های وردپرس 7
WALKER آموزش جلوگیری از فشرده سازی تصاویر در وردپرس و کاهش کیفیت آموزشهای وردپرس 0
WALKER دانلود Vision Interactive - Image Map Builder for WordPress v1.4.1 ایجاد تصاویر و نقشه تعاملی در وبسایت افزونه های وردپرس 3
WALKER دانلود اسکریپت گالری تصاویر گرید بی نهایت Infinite Grid Pro Wordpress Plugin v2.0 افزونه های وردپرس 1
WALKER آموزش حل خطای http موقع آپلود تصاویر در وردپرس آموزشهای وردپرس 0
WALKER دانلود افزونه فشرده سازی تصاویر در وردپرس WP Smush Pro v3.7.2 افزونه های وردپرس 39
WALKER دانلود افزونه ایجاد گالری تصاویر حرفه ای در وردپرس Global Gallery - Wordpress Responsive Gallery v7.052 افزونه های وردپرس 18
WALKER آموزش حل مشکل ثابت شدن تصاویر gif در وردپرس آموزشهای وردپرس 0
Magical اندروید دانلود Photobooth mini FULL 53 - نرم افزار ثبت تصاویر و ویدیو خنده دار برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Image Converter Pro 6.08 - نرم افزار تبدیل فرمت تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود GIFShop Pro 7.7 - نرم افزار ایجاد و ویرایش تصاویر گیف برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Glitch Pro 3.11.0 - نرم افزار ویرایش ناقص و مبهم تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Resize Me! - Photo resizer Full 1.91 - نرم افزار تغییر آسان و سریع اندازه تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود MapCam Pro - Geo Camera & Collages 4.5.5 - نرم افزار ثبت اطلاعات موقعیت مکانی تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود TouchRemove 2018 3.2 - نرم افزار حذف موارد ناخواسته از تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود TextO Pro - Write on Photos Full 1.5 - نرم افزار نوشتن حرفه ای متن بر روی تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Ephoto 360 - Photo Effects Premium 1.4.55 - نرم افزار ویرایش و افکت گذاری تصاویر برای اندروید نرم افزارهای اندروید 2
Magical اندروید دانلود Timestamp camera photos - Auto timestamp on photos 1.5 - نرم افزار درج خودکار تاریخ و زمان روی تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Tattoo my Photo 2.0 Pro 2.97 - نرم افزار تتو روی تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Photo Scan, Photo Editor - Quisquee Pro 4.7.h - نرم افزار اسکن و ویرایش تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Auto Collage Photo Grid Maker,Pics Frame Editor PRO 1.3 - نرم افزار کلاژ ساز خودکار تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Picas – Photo Artwork Editor VIP 2.0.2 - نرم افزار ویرایش هنری تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Geotag Photos Pro 2 1.7.3 - نرم افزار برچسب گذاری جغرافیایی تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود PixelLab - Text on pictures 1.9.2 - نرم افزار افزودن متن روی تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Video2me Pro 1.5.14 - نرم افزار بی نظیر ساخت تصاویر GIF برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود shot on Pro - Auto Add Sign & Shot on mark on pic 3.0 - نرم افزار قرار دادن امضای دیجیتال روی تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Solid – Text Mask & Shapes Premium 1.1 - نرم افزار ویرایشگر حرفه ای و مدرن تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود InstaSize-Photo Editor Pro 4.0.26 - نرم افزار ویرایش تصاویر اینستا سایز برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Word Cloud Premium 2.3.0 - نرم افزار ساخت تصاویر گرافیکی از کلمات برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Filterloop Pro 2.3.0 - نرم افزار زیبا ساز و ویرایشگر فوق العاده تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود PictureJam Collage Maker Plus 1.4.3a - نرم افزار ساخت تصاویر کلاژ برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Loopsie - Cinemagraph, Living Photo Full 2.3.15 - نرم افزار ساخت تصاویر زنده برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Photo Watermark No Ad 2.02 - نرم افزار واتر مارک تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود ARTi Art effects Photo editor Premium 2.3.0 - نرم افزار تبدیل تصاویر به نقاشی و آثار هنری برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Image Resizer Crop and Compress Photo & Picture PRO 2.0 - نرم افزار پر امکانات تغییر اندازه تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Photo Editor Pro - Beauty Editor - No Ads 1.02 - نرم افزار ویرایشگر و فیلتر تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Word Swag - Cool fonts, quotes 2.2.7.1 - نرم افزار ایجاد متون جادویی روی تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود PicTapGo 1.0.4-b152 - نرم افزار ویرایش تصاویر سریع و ساده برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود AppForType Full 1.5.4 - نرم افزار نوشتن متن کوتاه روی تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Mirror Lab Full 2.1 - نرم افزار ویرایش آینه ای تصاویر برای اندروید نرم افزارهای اندروید 0
Magical اندروید دانلود Paletta - Smart color splash Pro 2.1.2 - نرم افزار تغییر رنگ هوشمندانه تصاویر برای اندروید نرم افزارهای اندروید 0

موضوعات مشابه

بالا