首页| 论坛| 搜索| 消息
主题:WordPress发布了一个“近乎即时加载时间”的性能插件
爱我中华发表于 2024-04-19 15:03
WordPress 发布了一个官方插件,增加了对称为推测加载的尖端技术的支持,该技术可以帮助提高网站性能并改善网站访问者的用户体验。
投机加载
渲染是指构建整个网页以便立即显示(渲染)。当您的浏览器下载 HTML、图像和其他资源并将其组合到网页中时,这就是渲染。预渲染是在后台将该网页放在一起(渲染)。该插件的作用是使浏览器能够预渲染用户接下来可能导航到的整个网页。该插件通过根据用户悬停的位置预测用户可能导航到哪个网页来实现这一点。Chrome 列出了仅当用户有至少 80% 的可能性导航到另一个网页时才进行预渲染的偏好。Chrome 官方预渲染支持页面解释道:“只有当用户加载页面的可能性很高时,才应该预渲染页面。这就是为什么 Chrome 地址栏预渲染选项仅在概率如此高(大于 80% 的时间)时才会发生。在同一开发人员页面中还有一个警告,即根据用户设置、内存使用情况和其他场景,预渲染可能不会发生(下面有关分析如何处理预渲染的更多详细信息)。推测性加载 API 解决了以前的解决方案无法解决的问题,因为过去它们只是预取 JavaScript 和 CSS 等资源,但实际上并没有预渲染整个网页。WordPress 官方公告是这样解释的:推测规则 API 简介推测规则 API 是一个新的 Web API,可以解决上述问题。它允许定义规则,以基于用户交互以 JSON 语法动态预取和/或预渲染特定结构的 URL,或者换句话说,在导航之前推测性地预加载这些 URL。例如,每当用户将鼠标悬停在页面上的任何链接上时,都可以使用此 API 来预呈现页面上的任何链接。”关于此新功能的 WordPress 官方页面对此进行了描述:“推测规则 API 是一种新的 Web API……它允许定义规则,以基于用户交互以 JSON 语法动态预取和/或预渲染某些结构的 URL,或者换句话说,在导航之前推测性地预加载这些 URL。例如,每当用户将鼠标悬停在页面上的任何链接时,可以使用此 API 来预呈现页面上的任何链接。此外,对于推测规则 API,“预渲染”实际上意味着预渲染整个页面,包括运行 JavaScript。一旦用户单击链接,这可能会导致近乎即时的加载时间,因为页面很可能已经完全加载。然而,这只是可能的配置之一。”新的 WordPress 插件添加了对推测规则 API 的支持。 Mozilla 开发者页面是了解 HTML 技术的重要资源,它是这样描述的:“推测规则 API 旨在提高未来导航的性能。它以文档 URL 而不是特定的资源文件为目标,因此对于多页面应用程序 (MPA) 而不是单页面应用程序 (SPA) 更有意义。推测规则 API 提供了广泛使用的 功能的替代方案,旨在取代仅 Chrome 已弃用的 功能。它对这些技术进行了许多改进,并提供了更具表现力、可配置的语法,用于指定应预取或预渲染哪些文档。”另请参阅:网站变得更快吗?新数据显示结果好坏参半
性能实验室插件
新插件由官方 WordPress 性能团队开发,该团队偶尔会推出新插件供用户在可能包含到实际 WordPress 核心之前进行测试。因此,这是第一个尝试新性能技术的好机会。新的 WordPress 插件默认设置为预呈现“WordPress 前端 URL”,即页面、帖子和存档页面。它的工作原理可以在设置下进行微调:设置 > 阅读 > 推测加载
浏览器兼容性
Chrome 108 支持推测性 API,但新插件使用的特定规则需要 Chrome 121 或更高版本。 Chrome 121 于 2024 年初发布。不支持的浏览器将简单地忽略该插件,不会对用户体验产生任何影响。查看由官方 WordPress 核心性能团队开发的新推测加载 WordPress 插件。
Analytics 如何处理预渲染
一位 WordPress 开发人员在评论中提出了一个问题,询问 Analytics 如何处理预渲染,其他人则回答说,由 Analytics 提供商来检测预渲染,而不是将其计为页面加载或网站访问。幸运的是,Google Analytics 和 Google 发布商代码 (GPT) 都能够处理预渲染。Chrome 开发者支持页面有一个关于分析如何处理预渲染的注释:“Google Analytics 通过默认延迟直到 2023 年 9 月激活来处理预渲染,而 Google 发布商代码 (GPT) 也进行了类似的更改,延迟触发广告直到 2023 年 11 月激活。”
与广告拦截器扩展可能存在冲突
除了它是一个需要 Chrome 121 或更高版本的实验性功能这一事实之外,关于此插件还有一些需要注意的事情。WordPress 插件开发人员评论称,此功能可能不适用于使用 uBlock Origin 广告拦截浏览器扩展的浏览器。
回帖(4):
4 # srwam
04-20 16:46
了解一下
3 # srwam
04-20 16:46
来看看
2 # ddwg0818
04-20 01:23
感谢楼主分享!飞扬有你更精彩!
1 # ddwg0818
04-20 01:23
顺便学习一下

全部回帖(4)»
最新回帖
收藏本帖
发新帖