联系我们
简单又实用的WordPress网站制作教学
当前位置:网站首页 > WordPress插件 > 正文

优化检测(开发人员预览)最好的WordPress常用插件下载博客插件模块

作者:98wpeu发布时间:2024-04-19分类:WordPress插件浏览:132


导读:优化检测(开发人员预览)安装这个插件捕捉各种设备外形(如桌面、平板电脑和手机)在页面上显示哪些元素的真实用户指标,以便应用WordPress当前的服务器端启发式方法无法实现的加载优...
优化检测(开发人员预览)安装

这个插件捕捉各种设备外形(如桌面、平板电脑和手机)在页面上显示哪些元素的真实用户指标,以便应用WordPress当前的服务器端启发式方法无法实现的加载优化。

背景

WordPress使用服务器端启发式方法来猜测哪些图像可能会出现在初始视区中。同样,它使用服务器端启发式方法来识别英雄形象,这很可能是最大的内容绘画(Content Paint,LCP)元素。为了优化页面加载,它避免了延迟加载这些图像,同时还添加了fetchpriority=high为英雄形象干杯。当这些启发式算法被成功应用时,页面加载的LCP度量可以提高5-10%。然而,不幸的是,启发式算法存在局限性,使得正确识别哪个图像是LCP元素仅约50%有效。请参阅分析WordPress 6.3在现场对核心网络生命的性能影响。例如,LCP元素在不同的视区宽度之间变化是很常见的,例如桌面和移动设备。由于WordPress-S试探法完全是服务器端的,它不知道页面实际是如何布局的,也不能根据客户端-S的视窗宽度来确定图像加载的优先级。

为了提高识别LCP元素的准确性,包括跨各种客户端视区宽度,此插件从实际用户(RUM)收集指标以检测实际的LCP元素,然后使用此信息优化页面以供将来的访问者使用,以便正确确定LCP元素的加载优先级。这就是优化侦探的目的。这种方法的灵感很大程度上来自于菲利普·沃尔顿动态的LCP优先事项:从过去的访问中学习。另请参阅介绍该项目的初始探索文档:通过客户端检测进行图像加载优化。

技术基础

优化检测的核心是“URL度量”,即根据客户端如何加载具有特定视窗宽度的页面的信息。这包括哪些元素在初始视口中可见,以及哪些元素是LCP元素。站点上的每个URL都可以有一组关联的URL指标(存储在自定义帖子类型中),这些指标是从真实用户那里收集的。它根据常见的响应断点(例如移动设备、平板电脑和台式机)收集URL指标样本。当由于获得了断点的样本大小而不再需要URL的URL指标时,它将停止提供用于收集指标的Java脚本(利用web-vitals.js库)。有了URL Metrics后,输出缓冲的页面将通过HTML标记处理器发送,作为各种断点的LCP元素的图像将使用高优先级预加载链接(以及fetchpriority=high在实际情况下img标签,当它是所有断点上的公共LCP元素时)。具有通过内联添加的背景图像的LCP元素background-image样式也使用预加载链接来确定优先级。

URL指标有一个“新鲜度TTL”,在此之后它们将变得陈旧,并且将再次提供服务以开始再次收集指标,以确保正确的元素继续获得它们的加载优先级。当URL指标自定义帖子类型有一段时间没有被触及时,它会自动被垃圾回收。

对作为LCP元素的图像的加载进行优先排序只是作为如何应用其他优化的概念证明而实现的第一个优化。有关仅适用于URL Metrics rum数据的计划中的其他优化,请参阅问题列表。

请注意,默认情况下,不会为管理员用户收集URL度量,因为他们不是普通的站点访问者,而且页面上可能会出现其他元素,这些元素也不会显示给非管理员用户。

WP_DEBUG启用常量,则会将优化检测的附加日志添加到浏览器控制台。

滤器

过滤器:od_breakpoint_max_widths(默认:[480,600,782])

筛选断点最大宽度以对各个视区的URL度量进行分组。每个数字表示给定断点的最大宽度(包括)。因此,如果有一个数字480,则这意味着将有两个视区分组,一个代表0<;=480,另一个代表>;480。如果提供了三个断点(320、480、576),则这意味着将有四个组:

0-320(小型智能手机)321-480(普通智能手机)481-576(平板手机)和GT;576(台式机)

来自Gutenberg的默认断点被重用,这似乎是影响前端样式的媒体查询中使用最多的。

过滤器:od_can_optimize_response(默认:布尔条件,见下文)

筛选当前响应是否可以优化。默认情况下,仅在以下情况下才执行检测和优化:

它不是搜索模板(即is_search())。这不是定制者预览。它不是对POST请求。用户不是管理员(即customize能力)。

在开发过程中,您可能希望强制始终启用此功能:

<?phpadd_filter( 'od_can_optimize_response', '__return_true' );

过滤器:od_url_metrics_breakpoint_sample_size(默认:3)

筛选断点的样本大小-给定URL上的S URL指标。样本大小必须大于零。在开发过程中,将样本大小减少到1:

<?phpadd_filter( 'od_url_metrics_breakpoint_sample_size', function () { return 1; } );

过滤器:od_url_metric_storage_lock_ttl(默认:1分钟)

过滤给定IP锁定提交另一个指标存储REST API请求的时间长度。将TTL过滤为零将禁用任何指标存储锁定。例如,当用户使用如下代码登录时,这对于禁用锁定很有用:

<?phpadd_filter( 'od_metrics_storage_lock_ttl', function ( $ttl ) {    return is_user_logged_in() ? 0 : $ttl;} );

过滤器:od_url_metric_freshness_ttl(默认:1天)

筛选给定URL指标的新鲜期(TTL)。新鲜度TTL必须至少为零,在该值中,它认为URL指标始终是过时的。实际上,该值应至少为一小时。在开发过程中,将其设置为零非常有用:

<?phpadd_filter( 'od_url_metric_freshness_ttl', '__return_zero' );

过滤器:od_detection_time_window(默认:5秒)

筛选允许运行负载检测的服务时间和运行时间之间的时间窗口。这个量是第一次生成(或者缓存)页面的时间和页面上的检测功能被允许执行其检测逻辑并提交请求以存储结果之间的间隔。这避免了缺少URL指标的情况,在这种情况下,具有页面缓存的站点也有大量流量,可能会导致缓存踩踏。

过滤器:od_template_output_buffer(默认:HTML响应)

在发送到客户端之前筛选模板输出缓冲区。添加此过滤器是为了实现#43258。

安装从WordPress内安装访问插件&>添加新项.搜索优化检测。安装并激活优化检测插件。手动安装上传整个optimization-detective文件夹复制到/wp-content/plugins/Directory.Visit插件.激活优化检测Plugin.FAQ:这个插件的状态是什么?开发者预览是什么意思?

这个初始版本的优化检测插件是对可以在此基础上应用的各种优化的预览。其目的是这个插件将作为一个API,计划最终为WordPress核心提出,在其中其他插件可以扩展功能,以应用额外的优化。随着开发的进展,将提供更多的文档。关注GitHub上的进展。

我可以在哪里提交我的插件反馈?

我们鼓励并赞赏反馈,特别是考虑到该插件可能包含未来的WordPress核心功能。如果您对新功能有建议或请求,您可以将它们作为问题提交到WordPress性能团队--S GitHub资源库。如果您在故障排除方面需要帮助或对插件有疑问,请在我们的支持论坛上创建一个新主题。

我可以在哪里报告安全漏洞?

Performance团队和WordPress社区认真对待安全漏洞。我们感谢您负责任地披露您的调查结果,并将尽一切努力认可您的贡献。

要报告安全问题,请访问WordPress HackerOne程序。

我如何为该插件做出贡献?

随时欢迎捐款!了解有关如何参与《核心绩效团队手册》的更多信息。

插件源代码位于GitHub上的WordPress/性能仓库中。

该插件没有评论。

标签:改进启发式量度真实用户WordPress


WordPress插件排行
最近发表
网站分类
标签列表