WordPress 5.7 关于延迟加载iframe的修改

在WordPress 5.7中，默认情况下，使用浏览器级loading属性会延迟加载 iframe 。这将为iframe带来与WordPress 5.5 延迟加载图像相同的性能优势。

对嵌入内容的影响

默认情况下，WordPress会将loading="lazy" 属性添加到以下iframe：

文章内容中的iframe（the_content）
摘要中的iframe（the_excerpt）
文本小工具中的iframe（widget_text_content）

WordPress网站上使用的大多数iframe通常来自其嵌入（oEmbed）集成，当粘贴到编辑器中时，它将自动将某些Web平台资源（例如tweet或YouTube视频）的URL转换为引用的嵌入式媒体。

这些iframe标签的标记由相应的Web服务控制，并且只有某些Web服务遵循提供width和height属性的最佳做法。由于WordPress无法猜测嵌入式资源的尺寸，因此仅当oEmbed iframe 标记同时包含两个尺寸属性时，才会添加loading="lazy"属性。

自定义延迟加载iframe

开发人员可以自定义是否将iframe以及是否进行延迟加载，其方式类似于对图片进行延迟加载的方式，主要的过滤条件是现存的wp_lazy_loading_enabled，默认情况下返回true，也就是默认开启延迟加载iframe。

例如，如果您希望默认情况下针对文章内容中的iframe关闭延迟加载，则可以使用以下代码段：

function disable_post_content_iframe_lazy_loading( $default, $tag_name, $context ) {
     if ( 'iframe' === $tag_name && 'the_content' === $context ) {
         return false;
     }
     return $default;
 }
 add_filter(
     'wp_lazy_loading_enabled',
     'disable_post_content_iframe_lazy_loading',
     10,
     3
 );

此外，还有一个新的wp_iframe_tag_add_loading_attr过滤器，允许自定义特定iframe标签。例如，您可以使用此过滤器跳过可能会在最初可见视口中出现的iframe上添加loading属性，以避免影响“最大内容绘画”度量标准。过滤器具有与wp_img_tag_add_loading_attr图像相关过滤器相同的签名。

这是一个示例代码段，该代码段将禁用将YouTube视频嵌入到文章内容中的延迟加载iframe：

function skip_loading_lazy_youtube_iframes( $value, $iframe, $context ) {
     if ( 'the_content' === $context && false !== strpos( $iframe, 'youtube.com' ) {
         return false;
     }
     return $value;
 }
 add_filter(
     'wp_iframe_tag_add_loading_attr',
     'skip_loading_lazy_youtube_iframes',
     10,
     3
 );

请参阅图像延迟加载公告的“自定义延迟加载”部分以获取更多指导。

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。