Media: Add decoding="async" to image attributes.

Dynamically add `decoding="async"` to image tags on the front end of a site to instruct browsers to download them in parallel.

Modifies `wp_get_attachment_image()`, `get_avatar()` to include the attribute by default. Modifies `wp_filter_content_tags()` to add the attribute during the front-end render of the site.

Introduces `wp_img_tag_add_decoding_attr()` to take an image tag and modify it to include the attribute. Introduces the filter `wp_img_tag_add_decoding_attr` used to define the default value for the attribute.

Props adamsilverstein, ayeshrajans, costdev, flixos90, hellofromtonya, isaumya, michaelbourne, mihai2u, mitogh, sergiomdgomes, spacedmonkey, westonruter, peterwilsoncc.
Fixes #53232.


git-svn-id: https://develop.svn.wordpress.org/trunk@53480 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Peter Wilson
2022-06-09 05:29:57 +00:00
parent fc121d69e9
commit 270259115c
9 changed files with 90 additions and 29 deletions

View File

@@ -2764,6 +2764,7 @@ if ( ! function_exists( 'get_avatar' ) ) :
'force_display' => false,
'loading' => null,
'extra_attr' => '',
'decoding' => 'async',
);
if ( wp_lazy_loading_enabled( 'img', 'get_avatar' ) ) {
@@ -2851,6 +2852,13 @@ if ( ! function_exists( 'get_avatar' ) ) :
$extra_attr .= "loading='{$loading}'";
}
if ( in_array( $args['decoding'], array( 'async', 'sync', 'auto' ) ) && ! preg_match( '/\bdecoding\s*=/', $extra_attr ) ) {
if ( ! empty( $extra_attr ) ) {
$extra_attr .= ' ';
}
$extra_attr .= "decoding='{$args['decoding']}'";
}
$avatar = sprintf(
"<img alt='%s' src='%s' srcset='%s' class='%s' height='%d' width='%d' %s/>",
esc_attr( $args['alt'] ),