如今，网页充满了旨在改善用户体验的图像、视频和交互元素。但是，这些元素可能会减慢页面的加载时间。
随着技术的进步，有一个目标始终不变：性能。每个人都希闪电般的速度加载。
使网页加载速度更快的一种方法是在用户导航到网页之前预渲染或预加载它们。
预渲染简史
2011 年，Chromium 团队使用标签在 Chrome 浏览器中引入了第一种形式的预渲染<link rel="prerender" … >。
这使得开发人员可以告诉浏览器用户接下来将访问哪个页面。然后，浏览器 委内瑞拉 B2B 潜在客户 会在后台默默地搜索和处理这些页面，从而大大减少用户导航到这些页面时的加载时间。
尽管有其优点，但这种早期的预渲染实现使用了大量的带宽和 CPU 资源，如果用户不访问预渲染页面，可能会导致隐私问题。此外，您必须手动选择要预渲染的链接，这并不总是高效或可行的。
为了解决其中一些问题，Chrome 弃用了使用链接提示的预渲染，rel=prerender转而使用NoState Prefetch方法，该方法无需运行 JavaScript 或其他可能侵犯隐私的操作即可获取页面资源。
NoState Prefetch 方法改进了资源加载，但无法提供即时页面加载，如完整预渲染。
推测规则 API 简介
推测规则 API是一个新的实验性 JSON 定义的 API，它在导航到 URL 之前推测性地预加载 URL，从而实现更快的渲染时间和更好的用户体验。
该 API 允许开发人员使用 JSON 格式定义的结构来配置规则script type="speculationrules"，浏览器可以使用该结构来决定应预渲染哪些 URL。
<script type="speculationrules">
{
"prerender": [
{
"source": "list",
"urls": ["firstpage.html", "secondpage.html"]
}
]
}
</script>
这同样适用于预加载，这通常是预渲染道路上良好的第一步：
<script type="speculationrules">
{
"prefetch": [
{
"urls": ["firstpage.html", "secondpage.html"]
}
]
}
</script>
上面的代码片段显示了推测规则 API 的工作原理，指定要前缀或预渲染的 URL 列表。
最近，Google 宣布了对推测规则 API 的新改进，现在提供了使用文档规则自动搜索链接的选项。这是通过根据条件获取文档 URL 来实现的where。
<script type="speculationrules">
{
"prerender": [
{
"source": "document",
"where": {
"and": [
{
"href_matches": "/*"
},
{
"not": {
"href_matches": [
"/wp-login.php",
"/wp-admin/*"
]
}
}
]
},
"eagerness": "moderate"
}
]
}
</script>
在此代码片段中，所有页面 URL 都被考虑进行预渲染，除
