Follow for free plugins, new theme releases and theme news
Plugin Description
A drop dead simple and lightweight image, iframe, and video optimization plugin to satisfy Google PageSpeed Insights, Lighthouse, and overall user experience.
This tiny little plugin (around 14kb zipped) will automatically lazy load your below the fold images/iframes/videos, preload your featured images, and add loading=”eager” to your featured image and all images that have no-lazy or skip-lazy class.
Features
- Lazy Load:
- Images, iframes, and videos.
- Inline background images.
- CSS background image (simply put
lazyload class to the background image container)
- Preload Featured Images
Automatically preloading featured image from common page/post (homepage, pages except homepage, single post, and woocommerce single product pages)
- Add loading=”eager” attribute to to your featured image and all images that have
no-lazy or skip-lazy class.
Disclaimer
- Lazy load feature are using Lazysizes library (around 3kb, gzipped and minified).
- This plugin doesn’t add anything to your database since there’s no settings and options. Everything will automatically activated after you activate the plugin.
- You can change some default settings using filter.
About Lazysizes
Lazysizes is highly performant lazy load library, written by Alexander Farkas in pure JS with no dependencies.
Taken from lazysize’s github description:
High performance and SEO friendly lazy loader for images (responsive and normal), iframes and more, that detects any visibility changes triggered through user interaction, CSS or JavaScript without configuration.
Filters
Example filter to add extra lazyload exclude list:
add_filter( 'extra_exclude_list', function($extra_exclude_list) {
return array(
'my-logo', 'my-hero-img', 'exclude-lazy'
);
} );
Example filter to change lazysizes config:
add_filter( 'lazysizes_js_before', function($lazysizes_js_before) {
return 'window.lazySizesConfig = {
expand: 500,
threshold: 500
};'
} );
Example filter to change the image sizes for preload featured image:
add_filter( 'lpam_preload_featured_images_image_size', function($image_size, $post) {
if ( is_singular( 'post' ) ) { return 'large'; }
elseif ( is_singular( 'product' ) ) { return 'full'; }
else { return $image_size; }
}, 10, 2 );
USEFUL PLUGINS TO OPTIMIZE YOUR SITE’S SPEED:
- Optimize More! – Selectively Optimize your CSS/JS Delivery: Load CSS Asynchronously, Delay CSS and JavaScripts until User Interaction, Preload Critical CSS and JavaScripts, and Remove Unused CSS and JavaScripts Files.
Other USEFUL PLUGIN:
-
Shop Extra – A lightweight plugin to optimize your WooCommerce & Business site: Floating WhatsApp Chat Widget (can be use without WooCommerce), WhatsApp Order Button for WooCommrece, Hide/Disable WooCommerce Elements, WooCommerce Strings Translations, and many more.
-
Animate on Scroll – Animate any Elements on scroll using the popular AOS JS library simply by adding class names. This plugin helps you integrate easily with AOS JS library to add any AOS animations to WordPress. Simply add the desired AOS animation to your element class name with “aos-” prefix and the plugin will add the corresponding aos attribute to the element tag.
Optimize More!
Need to optimize more? Try my WordPress Page Speed Optimization’s Service.
Screenshots
No screenshots provided
