Largest Contentful Paint image was lazily loaded

Das Lazy-Loading des „Largest Contentful Paint-Bildes“ löst eine Lighthouse-Warnung aus. Meistens dürfte das Einzelbeiträge mit Beitragsbildern treffen. Die von mir über den Coverblock eingefügten Beitragsbilder erhielten das Attribut „loading“ mit dem Wert „lazy“, was eigentlich nur dann erwünscht ist, wenn sich ein Bild beim Aufruf einer Seite (noch) außerhalb des Sichtbereichs befindet.

Das Tag hat auch einen direkten Filter, allerdings muss man den Output z.B. nach „wp-post-image“ durchsuchen, um herauszufinden, ob man es grade mit einem Beitragsbild zu tun hat.

add_filter( 'wp_img_tag_add_loading_attr', function( $value, $image ){
	if ( false !== strpos( $image, 'wp-post-image' ) ){
		return false;
	}
	return true;
}, 10, 2 );

Er ist allerdings gut geeignet, wenn man lazy load ganz abschalten möchte.

add_filter( 'wp_img_tag_add_loading_attr', function( $value, $image ){
	return false;
}, 10, 2 );

Um nur das Beitragsbild „eager“ zu laden, entschied ich mich für den „wp_get_attachment_image_attributes“-Filter. Er ersetzte tatsächlich nur im Beitragsbild den Wert des „loading“-Attributes. Der Wert „eager“ (eifrig) ist ein ebenfalls gültiger Wert für das Attribut „loading“.

function disable_lazy_load_single_featured( $attr, $attachment, $size ) {
	if ( !is_single() ) return $attr;
	$attr['loading'] = 'eager';
	return $attr;
}
add_filter( 'wp_get_attachment_image_attributes', 'disable_lazy_load_single_featured', 10, 3 );

Nicht funktioniert hat hingegen das Snippet mit dem ich versuchte, das Attribut zu entfernen. Im Debug-Output war zwar zu sehen, dass nach dem „unset“ das Attribut tatsächlich weg war. Offenbar suchte eine später in Aktion tretende Instanz nach dem Attribut und fügte es wieder mit dem Wert „lazy“ ein, wenn es nicht bereits vorhanden war, wohingegen beim Überschreiben nicht mehr weiter mit dem Attribut passierte. Das bedeutet allerdings nicht, dass es bei Dir nicht erfüllt was es soll.

function disable_lazy_load_single_featured( $attr, $attachment, $size ) {
	if ( !is_single() ) return $attr;
	unset( $attr['loading'] );
	return $attr;
}
add_filter( 'wp_get_attachment_image_attributes', 'disable_lazy_load_single_featured', 10, 3 );