如何使用原生Wordpress集成的Lazy Loading懒加载

/**
 * Initialise filters and actions.
 */function _wp_lazy_loading_initialize_filters() {
// The following filters would be merged into core.
foreach ( array( 'the_content', 'the_excerpt', 'widget_text_content' ) as $filter ) {
add_filter( $filter, 'wp_filter_content_tags' );
}
// The following filters are only needed while this is a feature plugin.
add_filter( 'wp_get_attachment_image_attributes', '_wp_lazy_loading_add_attribute_to_attachment_image' );
add_filter( 'get_avatar', '_wp_lazy_loading_add_attribute_to_avatar' );
// The following relevant filter from core should be removed when merged.
remove_filter( 'the_content', 'wp_make_content_images_responsive' );
}
add_action( 'plugins_loaded', '_wp_lazy_loading_initialize_filters', 1 );
/**
 * Adds loading attribute to an avatar image tag.
 */function _wp_lazy_loading_add_attribute_to_avatar( $avatar ) {
if ( wp_lazy_loading_enabled( 'img', 'get_avatar' ) && false === strpos( $avatar, ' loading=' ) ) {
$avatar = str_replace( '<img ', '<img loading="lazy" ', $avatar );
}
return $avatar;
}
/**
 * Adds loading attribute to an attachment image tag.
 */function _wp_lazy_loading_add_attribute_to_attachment_image( $attr ) {
if ( wp_lazy_loading_enabled( 'img', 'wp_get_attachment_image' ) && ! isset( $attr['loading'] ) ) {
$attr['loading'] = 'lazy';
}
return $attr;
}
/**
 * Determine whether to add the `loading` attribute to the specified tag in the specified context.
 */function wp_lazy_loading_enabled( $tag_name, $context ) {
// By default add to all 'img' tags.
// See https://html.spec.whatwg.org/multipage/embedded-content.html#attr-img-loading
$default = ( 'img' === $tag_name );
/**
 * Filters whether to add the `loading` attribute to the specified tag in the specified context.
 */return (bool) apply_filters( 'wp_lazy_loading_enabled', $default, $tag_name, $context );
}
/**
 * Filters specific tags in post content and modifies their markup.
 */function wp_filter_content_tags( $content, $context = null ) {
if ( null === $context ) {
$context = current_filter();
}
$add_loading_attr = wp_lazy_loading_enabled( 'img', $context );
if ( false === strpos( $content, '<img' ) ) {
return $content;
}
if ( ! preg_match_all( '/<img\s[^>]+>/', $content, $matches ) ) {
return $content;
}
// List of the unique `img` tags found in $content.
$images = array();
foreach ( $matches[0] as $image ) {
if ( preg_match( '/wp-image-([0-9]+)/i', $image, $class_id ) ) {
$attachment_id = absint( $class_id[1] );
if ( $attachment_id ) {
/*
 * If exactly the same image tag is used more than once, overwrite it.
 * All identical tags will be replaced later with 'str_replace()'.
 */$images[ $image ] = $attachment_id;
continue;
}
}
$images[ $image ] = 0;
}
// Reduce the array to unique attachment IDs.
$attachment_ids = array_unique( array_filter( array_values( $images ) ) );
if ( count( $attachment_ids ) > 1 ) {
/*
 * Warm the object cache with post and meta information for all found
 * images to avoid making individual database calls.
 */_prime_post_caches( $attachment_ids, false, true );
}
foreach ( $images as $image => $attachment_id ) {
$filtered_image = $image;
// Add 'srcset' and 'sizes' attributes if applicable.
if ( $attachment_id > 0 && false === strpos( $filtered_image, ' srcset=' ) ) {
$filtered_image = wp_img_tag_add_srcset_and_sizes_attr( $filtered_image, $context, $attachment_id );
}
// Add 'loading' attribute if applicable.
if ( $add_loading_attr && false === strpos( $filtered_image, ' loading=' ) ) {
$filtered_image = wp_img_tag_add_loading_attr( $filtered_image, $context );
}
if ( $filtered_image !== $image ) {
$content = str_replace( $image, $filtered_image, $content );
}
}
return $content;
}
/**
 * Adds `loading` attribute to an existing `img` HTML tag.
 */function wp_img_tag_add_loading_attr( $image, $context ) {
/**
 * Filters the `loading` attribute value. Default `lazy`.
 */$value = apply_filters( 'wp_img_tag_add_loading_attr', 'lazy', $image, $context );
if ( $value ) {
if ( ! in_array( $value, array( 'lazy', 'eager' ), true ) ) {
$value = 'lazy';
}
return str_replace( '<img', '<img loading="' . $value . '"', $image );
}
return $image;
}
/**
 * Adds `srcset` and `sizes` attributes to an existing `img` HTML tag.
 */function wp_img_tag_add_srcset_and_sizes_attr( $image, $context, $attachment_id ) {
/**
 * Filters whether to add the `srcset` and `sizes` HTML attributes to the img tag. Default `true`.
 */$add = apply_filters( 'wp_img_tag_add_srcset_and_sizes_attr', true, $image, $context, $attachment_id );
if ( true === $add ) {
$image_meta = wp_get_attachment_metadata( $attachment_id );
return wp_image_add_srcset_and_sizes( $image, $image_meta, $attachment_id );
}
return $image;
}