So in the ever-continuing saga of learning, testing and fine-tuning your site’s settings to get the ultimate in performance you might have enjoyed the new Autoptimize filter/ setting not to lazyload the first N images to keep the impact of lazyloading on Largest Contentfull Paint down?
Well, now you can take things a step further with below code snippet, which tells Autoptimize not to lazyload the logo and the featured image (hat tip to Gijo Varghese of Flying Press for the idea).
add_filter('autoptimize_filter_imgopt_lazyload_exclude_array', function( $lazy_excl ){
// site logo.
$custom_logo_id = get_theme_mod( 'custom_logo' );
$image = wp_get_attachment_image_src( $custom_logo_id , 'full' );
$logo = $image[0];
if ( ! empty( $logo ) ) {
$lazy_excl[] = $logo;
}
// featured image.
if ( is_single() || is_page() ) {
$featured_img = get_the_post_thumbnail_url();
if ( ! empty( $featured_img ) ) {
$lazy_excl[] = $featured_img;
}
}
return $lazy_excl;
});This might end up in a future version of Autoptimize, maybe even preloading those images … 🙂
Nice feature, smarter than manually exclude by names and excluding the first n images.
Big fan of WT3C + Autoptimize + AsyncJS took my beta website from 50 to 95 in pagespeed
https://beta.eshirt.it/
thank you Frank,
I was trying to exclude featured image in single post and first post featured image inside category page. This snippet really helpful.
Regards,
Hi Donny;
As of 3.1.9 AO will exclude images with fetchpriority=high (as added by WordPress core since 6.3) from being lazyloaded, so that should render the snippet useless 🙂
If you want you can download the AO Beta from github; https://github.com/futtta/autoptimize/archive/refs/heads/beta.zip would be great if you could take it out for a spin to confirm if this works 🙂
best!
frank