如果您的网站运行缓慢，您将失去业务。意思很简单，用谷歌自己的话来说，“速度等于收入”。
您网站的速度直接影响 SEO 和转化率。不花时间进行改进可能是一个代价高昂的错误。
为什么？用户更有可能从速度较慢的网站跳出，如果 页面加载时间 从 1 秒增加到 6 秒，这种情况发生的可能性会增加 100% 以上：
确实需要速度，而 Google 的免费 PageSpeed Insights 工具是一个极好的资源，可帮助您查找和修复可能会降低网站速度的问题。
本文帮助您了解如何使用 PageSpeed 测试、它是如何工作的，以及如何使用推荐来加速您的网站。另外，在您的竞争对手之前了解一些常见神话背后的真相。
为什么速度很重要
人们期望网络变得更快。早在 2010 年，谷歌就确认页面速度是排名因素。然后，它“专注于桌面搜索”，直到2018 年 7 月推出了特定的移动 PageSpeed 更新。虽然速度是 200 多个排名因素之一，但我们都不想不必要地失去业务。特别是对于通常在我们控制范围内的事情。事实上，SEO 博客 Backlinko 分析了100 万个谷歌搜索结果，发现“网站速度与谷歌排名之间存在很强的相关性”。
但抛开 SEO 不谈，我们已经看到页面跳出率如何随着网站速度变慢而增加。事实上，美国数字营销机构Portent 2019 年的一项研究表明，“加载时间每增加一秒（0-5 秒之间），转化率平均下降 4.42%。” 它还发现页面加载时间的前 5 秒对转化率的影响最大。
如果您还没有将速度作为性能指标来关注，那么现在是时候了。
向 Google 的 PageSpeed Insights 工具问好
PageSpeed Insights 是 Google 提供的免费工具，可帮助您分析网站的性能并查看有关如何改进网站的建议。
事实上，它可以说是最流行的页面速度分析工具，因此值得您花时间。
Google PageSpeed Insights 可衡量网页在移动设备和桌面设备上的性能，并就可以采取哪些措施来提高网站速度提供可操作的指导。然后，该工具根据 0 到 100 的分数分别为移动和桌面对网站进行排名，其中 100 表示非常满足性能评分标准。
标准包括首次内容绘制、最大内容绘制、速度指数、总阻塞时间、交互时间和累积布局偏移。
到处都有很多文章可以帮助您详细了解如何最好地了解 PageSpeed 工具的工作方式，以及如何使用该工具提供的指南并将其实际应用于您的网站。
您可能想知道，“如何使用 PageSpeed Insights 获得 100/100 的分数？” 慢一点。首先，您需要知道如何正确使用该工具以及如何实施它提出的建议。否则，您可能看不到对您的网站产生如此大的影响的性能提升。了解什么是 PageSpeed 以及它不是什么也很重要。
PageSpeed 与加载时间
这是一个有趣的。Google PageSpeed 工具甚至不会测量您网站的加载时间。尽管人们假设。要了解原因，让我们首先解决 PageSpeed 和页面加载时间之间的区别。
页面速度
PageSpeed 是 Google 通过其 PageSpeed Insights 工具给出的分数，满分为 100。PageSpeed Insights 和为其提供支持的网页性能工具Lighthouse，采用原始性能指标并将其转换为 1 到 100 之间的分数。尽管它将提供机会和诊断报告作为其报告的一部分，但这些并没有直接贡献对性能分数。这意味着 PageSpeed 本身并不是网站加载时间的真正指标。
加载时间
那么，与 PageSpeed 相比，什么是加载时间？它是用户加载页面所需的平均时间。这不是计算出来的分数。这是页面加载开始和完成页面加载之间的实际时间，以秒或毫秒为单位。当然，仅靠加载时间并不能深入了解导致速度问题的原因或解决方法。
这对你意味着什么？
Google PageSpeed Insights 可能会有所帮助，但您不能单独使用它来评估您网站的性能。您需要使用多个指标来识别和解决问题。
PageSpeed Insights 如何工作？
Google PagesSpeed Insights 工具由 Lighthouse 提供支持，可为页面提供“实验室数据”和“现场数据”。“实验室数据”是在扫描页面时在受控环境中收集的，是识别性能问题和查找的好方法解决这些问题的解决方案。另一方面，“现场数据”是从用户加载您的页面时的真实性能数据中收集的。一些使您的真实访问者更难转换的问题和明显瓶颈可能会出现在这里。
简而言之，该工具会向您显示 100 分的性能分数。但是，用于计算此分数的性能指标结果的权重不同。相反，诸如“第一次内容绘制”（用户第一次看到的东西出现）之类的东西会产生更大的影响。
但你不会看到任何这些。您将看到报告的性能分数和颜色，颜色取决于它属于哪个分区间。据报道：
- 红色（低分）：0-49
- 橙色（平均）：50-89
- 绿色（好）：90-100
那么，了解更多关于 PageSpeed Insights、它是什么以及它的分数是如何计算的，您从哪里开始呢？
如何使用 PageSpeed Insights
1. 转到PageSpeed Insights 工具：
2. 输入网页的 URL。它不必是根域/主页。该工具计算出分数和建议后，您将看到以下内容：
3. 请注意，默认情况下您会收到移动设备的性能分数。您可以使用页面左上角的选项卡切换到桌面：
要真正了解如何使用 PageSpeed Insights，您需要知道所看到的一切意味着什么以及如何解释它。
速度得分
如上所述，速度得分是由 Lighthouse 一起计算的许多性能指标的颜色编码表示。这是一个很棒、快速但粗略的速度指标。
由于我们之前讨论过的原因，就其本身而言，它并不是对性能的深入衡量。在衡量的性能指标中，您网站的加载时间越差，您的速度得分就越高。请务必比较移动设备和桌面设备的速度得分。
现场数据
“现场数据”报告与Chrome 用户体验报告中的其他页面相比，该页面在过去 30 天内的表现如何- 这是从谷歌 Chrome 浏览器的一些用户收集的性能指标池。
如果可用，您还可以查看源摘要以及您正在测试的特定 URL。从本质上讲，这使您可以查看特定页面与原始页面中的所有页面之间的比较。
重要的是要知道字段数据是从 Chrome 上的实际用户聚合的。但您输入的 URL 可能没有足够的数据。如果是这种情况，您将只能查看“实验室数据”。
首次内容绘制 (FCP)
这衡量了从导航到页面到从 DOM 呈现第一位内容的时间所花费的时间。这是显示页面开始加载的第一个里程碑。FCP 报告了达到这一点的速度。
首次输入延迟 (FID)
这是衡量负载响应的关键指标，因为它量化了页面响应用户输入（例如鼠标单击）的速度。
低 FID 表明页面可以更快地使用。然而，由于 FCP 测量页面开始加载的速度，因此它可以指示用户在实际与页面交互时的第一印象。
实验室数据
与“现场数据”相比，“实验室数据”基于页面的 Lighthouse 分析以及模拟设备和连接。虽然这不会显示真实世界的数据，但它对于了解问题发生的位置仍然很有用。同样，PageSpeed Insights 在这里使用其熟悉的交通灯颜色系统来表示性能：显示绿色分数的圆圈，橙色的正方形和红色的三角形。
首次内容绘制 (FCP)
虽然 FCP 显示在“现场数据”报告中，但它基于 Lighthouse 的模拟分析，而不是真实世界的数据。
您的网站或网页的首次绘制时间越快，页面在其上显示内容的速度就越快。简单来说，这显示页面的主要内容何时显示在屏幕上，是确定用户加载体验的好方法。
速度指数
速度指数指标显示页面内容可见的速度，分数越低表示性能越好。
第一个 CPU 空闲
这会报告页面的大多数（但可能不是全部）元素何时是交互式的，以及页面何时能够响应大多数用户输入而不会过度延迟。
交互时间 (TTI)
TTI 衡量页面变得可交互的速度。优化交互性的可见性可能会让用户感到沮丧。因此，充分理解和衡量显示有用内容的页面何时在 50 毫秒内做出响应非常重要。
潜在最大输入延迟
还记得“现场数据”报告中的 FID 吗？对于“实验室数据”，这被报告为最大潜在第一次输入延迟，并显示用户可能经历的 FCP 后最长任务的持续时间。
机会
诊断
另一方面，诊断显示关于最佳实践的建议，这些建议应该被考虑，但不一定会改善加载时间。
通过审核
听起来就是通过审核。
什么是好的 PageSpeed 分数？
即使您没有达到 100/100，您仍然可以拥有一个快速加载的网站。请记住，PageSpeed 本身并不是加载时间的直接指标。
尽管做出了对网站加载时间产生积极影响的重大改进，但您可能永远不会达到完美的分数。将您的努力和资源集中在最有意义的地方。正如 WordPress 托管平台Kinsta 所说，“在 Google PageSpeed Insights 中获得 100/100 实际上并不那么重要。”通常被引用为一个常见的神话，即您需要获得 100/100 的分数才能使您的网站表现良好。
请注意，网站性能的真正指标是其加载时间，而不是 PageSpeed Insights 分数。也就是说，我们看到谷歌本身分解为差分在 0 到 49 之间，平均分在 50 到 89 之间，好分是 90+。目标明确，但不要执着于获得 100 分。在某种程度上，了解您在 SERP 上直接与之竞争的站点如何累积也很重要。如果您获得了更快的加载时间和更好的 PageSpeed 分数，但仍然只获得了 92/100 的分数，那么您的努力很有可能被更好地分配到其他地方。
如何提高您的 PageSpeed Insights 分数
尝试下面推荐的操作（或最佳实践）和起点；它们是最常见的问题，对改进的影响最大。
优化图像
图像优化可能是网页加载时间缓慢的最常见原因之一，并且通常是开始改进的最佳位置，因为加载时间和 PageSpeed 的增加都非常显着。尤其是当有很多人负责上传内容或添加产品时，很难对图像保持严格的标准，并且问题会迅速增加。
图像需要大量资源来下载，而且它们通常没有得到适当的优化。您可以通过优化图像进行改进的两个主要领域是：
- 图像的磁盘大小。
- 显示大小与实际图像大小（以像素为单位）。
- 推迟屏幕外图像加载。
- 使用内容分发网络 (CDN)。
- 使用下一代图像。
优化图像尺寸
下载 1MB 的图像比下载 100KB 的图像需要更长的时间。为了解决这个问题，请在不降低质量的情况下压缩图像。您可以使用TinyPNG等工具来实现此目的，或者查看Google 的推荐 ImageMagick。
按显示大小调整图像大小
另一个常见问题是图像不必要地比需要的大得多。假设您的页面显示 250 x 250 像素的图像。如果原始图像实际上是 1000 x 1000 像素，但它的样式使用 CSS 显示得更小，则可以使加载时间更快。就目前而言，浏览器需要下载原始（较大的）图像才能以较小的尺寸显示。
使用内容交付网络 (CDN)
确保上传尺寸正确的图片；否则，毫无疑问，您会遇到速度问题。WordPress 通过在上传时创建图像的多个版本来自动处理此问题，但如果您使用其他 CMS，则可能需要手动调整图像大小。
使用 CDN 本质上是将服务器负载分散到许多不同的位置，并使用离用户最近的位置来为资产提供服务。数据越接近，加载时间越快。听起来不错？在尝试之前，请检查CDN的必知 SEO 实践。
延迟屏幕外图像
您还可以查看延迟屏幕外图像，这意味着它们仅在用户滚动时下载。确实存在并非所有图像在需要时都可见的风险。然而，为了改善加载时间，通常值得做出妥协。您可以找到许多可以提供帮助的WordPress 插件，或者Google 对屏幕外图像有自己的建议。
使用下一代图像格式
最后，考虑使用下一代图像格式，如WebP。 已经证明 ，与 JPG 相比，WebP 图像可以使平均图像大小减少 85.87%，与 PNG相比减少42.8% 。
并非所有主要浏览器都支持它们，但某些应用程序可以处理 WebP。
改善服务器响应时间
现实情况是，考虑到两个真正的影响领域是减少负载或改进硬件，大多数人都没有能力改进服务器的响应时间。改善服务器响应时间实际上归结为确保您的站点托管在出色的服务器上。
如果您看到与服务器响应时间或 TTFB（到第一个字节的时间）相关的建议，请与您的托管服务提供商交谈或考虑更适合您站点的托管解决方案。
压缩
在编写代码时，通常会使用空格以使其易于阅读。简单地说，缩小删除空格和注释以优化 CSS 和 JS 文件，并且可以使用简单的复制粘贴工具（例如 Minify ）来完成。
浏览器缓存
如果您使用 WordPress 作为您的 CMS（估计有35% 的网络使用），那么使用浏览器缓存再简单不过了，包括W3 Total Cache和WP Super Cache 等流行的免费插件。
缓存的工作原理是创建网站的静态版本并将其快速提供给用户，而不是每次访问时动态生成页面。
如果您没有使用 WordPress，仍然可以手动设置浏览器缓存。
清除重定向
随着时间的推移，多次重定向会累积并导致页面加载速度变慢，因为浏览器被迫发出额外的 HTTP 请求，从而增加加载时间。PageSpeed Insights 将突出这些问题。
使用 PageSpeed 工具获得 100/100 分数后可以完成的额外步骤
1. 使用竞争对手的浏览器缓存
如果您的竞争对手的关键字排名略高于您，那么用户很可能会在点击您的网站之前访问其网站（如果有的话）。但是，如果用户访问了另一个站点，您可以通过检查站点的源代码来重用访问者的浏览器缓存，以查看它是否使用任何公共 CDN，如果使用，则使用哪个库。
如果你们都使用相同的库，例如 jQuery 3.2.1，则可以从竞争对手使用的相同公共 CDN 加载它。
正如您可能猜到的那样，此技巧很少起作用，并且在某些情况下，如果访问者首先访问您的网站，然后访问您的竞争对手，则可能会给您的竞争对手带来好处。
虽然这个技巧不太可能对你的竞争对手起作用，但这通常是有效的。从公共 CDN 加载所有开源资源可帮助您重用用户过去任何时间访问过的第三方网站的浏览器缓存中的公共资源。
Easy Speedup 和 CommonWP等一些免费的 WordPress 插件有助于自动链接到公共 CDN 上托管的开源主题、插件和库。此类插件可以轻松地大规模重用其他网站的浏览器缓存，而无需付出太多努力。
这种方法可能不适用于某些访问者，但可能适用于其他访问者。好处是，即使是第一次访问者，这也可以减少页面加载时间。额外的好处是这些开源资产是从 CDN 交付的，没有任何带宽费用。
2.合并文件，但要小心
一些性能测试工具可能会建议您将多个 CSS 和 JavaScript 文件合二为一以提高速度。这在很久以前是正确的，但现在时代已经改变。
如果包大小超过 50-100KB，请将其拆分为更小的包。如果脚本大于 1 KB，请避免内联它。
总体而言，将较小的文件捆绑到一个或多个捆绑包中是不值得的，因为它不再提高页面加载速度——相反，它会影响移动设备的速度。这是因为，通过 HTTP/2 多路复用，可以同时处理多个请求和响应，从而减少额外请求的开销。
那么，您的网站代码是否需要任何重构才能再次以旧方式做事？您可能需要考虑禁用在 WordPress 网站上启用此功能的插件。这将减少插件膨胀并加速您的网站。
但是，这并不意味着将整个 JavaScript 代码库拆分为许多较小的文件不会对您造成伤害。您需要仔细测试您的用例。
3. 在图像格式之间切换
图像占页面加载的很大一部分。因此，与常用的常见图像优化技术相比，它们需要更多的考虑。
如果您的网站使用图像，而且我确信确实如此，您可能需要了解哪种图像格式适合您的需求。某些图像格式更适合矢量，而其他图像格式最适合照片。
上面的图表可以帮助您在适合您的图像需求的格式之间进行选择。JPEG 支持对照片进行有损压缩，而 SVG 是一种基于文本的格式，可以即时压缩，并且在大多数情况下可以将文件大小减小到小于 PNG 的大小。
另一个考虑因素是新的图像格式。
PageSpeed 推荐“以下一代格式提供图像”。唯一广泛支持的下一代格式 WebP仅被 77% 的浏览器支持，而 Safari 浏览器不支持。因此，WebP 被网络上不超过 4% 的图像使用。
因此，使用 WebP 作为主要图像格式仍然是一个很大的问题。但是 WebP 格式极大地减少了文件大小，使其成为性能优化的一个非常有吸引力的选择。而且，在大多数情况下，根据浏览器的兼容性向浏览器提供图像是一个不错的选择。
这听起来可能很复杂，但事实并非如此。有一些解决方案可以自动执行这种动态图像转换。一旦您准备好在您的站点上使用 WebP，您有多种选择：
- 您可以使用 Easy Speedup WordPress 插件，该插件使用基于云的图像优化和转换服务，该服务同样适用于 WordPress 和非 WordPress 网站，并提供浏览器可以支持的最佳图像格式。还有一个PHP 库可用于为非 WordPress 网站自动完成这项工作，而不会增加存储使用量。该库非常擅长完成这项工作，以至于对于我的一个客户，我已经看到它将 PNG 图像转换并优化为 WebP，并将其大小减小了原始图像的 95%。这并不总是发生，但有时会发生。你的旅费可能会改变。
- 对于现场优化和转换，WebP Express将图像转换为 WebP，并在服务器上为每个图像维护多个副本，以将正确的图像传送到正确的浏览器。缺点是它会使文件系统膨胀，增加备份大小，并使迁移变得困难。他们还给主机带来了负担，因为转换和优化图像是一项昂贵的任务。
将图像转换为 WebP 是有回报的。节省是巨大的，并且在大多数情况下，整体页面大小减少到一半甚至更少。
还有更多。
另一个重要的事情是密切关注即将推出的令人兴奋的图像格式 JPEG XL。它处于标准化的最后阶段，可能很快就会完成并开始看到一些浏览器支持。它基于Google 的 PIK和Cloudinary 的 FUIF图像格式研究的组合。JPEG XL 的格式设置了以下两个设计要求，使其成为未来的网络图像格式：
- 高质量：在合理的比特率下视觉无损；
- 解码速度：多线程解码在大图上应该可以达到400 Megapixel/s 左右。
JPEG XL 有望在不损失质量的情况下将图像尺寸减小到原始尺寸的 1/3。它将成为有效支持摄影和非摄影图像的通用格式。因此，那些希望在未来使您的网站更快的人可能希望密切关注 JPEG XL 浏览器支持。先行者的优势是显着的。
4. 区分动态与静态压缩
这可能会以最少的努力加快您的网站的速度，并且可能是我要建议的最简单的技术。让我解释。
网站通常使用 .htaccess 或 NGINX 配置文件来为所有可压缩资源启用 Gzip 或 Brotli 压缩。这有效，但为更多优化留下了空间。由于更好的Brotli 压缩，网页可以节省超过 50 KB 的额外空间。想学习诀窍吗？很简单。区分动态压缩和静态压缩。
您的 Web 服务器托管的可压缩内容可以分为动态和静态两种类型。动态内容是动态生成的，无法提前压缩。HTML 页面就是一个例子。静态内容，如 CSS 和 JS，会在一段时间内保持不变。
您可以预压缩这些资产并配置您的服务器以即时提供这些预压缩文件。预压缩允许您使用更高的压缩级别，例如 Brotli:11，这对于即时压缩来说通常太慢了。如果每次文件更改时预压缩资源对您来说都很困难，您还可以使用 PageCDN 之类的 3rd 方服务来无缝地为您执行此操作。
5.减少DNS查找时间
DNS 查找时间是将域名解析为其 IP 地址所花费的时间。然后使用此 IP 地址在 Internet 上查找服务器的位置。
当用户访问页面时，浏览器执行的第一个高延迟任务是域名的 DNS 查找。除非浏览器从 DNS 查询中获得 IP 地址，否则它无法继续连接到服务器并发出 HTTP 请求。
理想情况下，减少 DNS 查找时间应该是 Time-to-First-Byte 优化策略的一部分，但似乎 PageSpeed 工具没有考虑它，因为在很多情况下，站长不可能在这方面进行优化. 结果，大量的网站管理员不会打扰他们的 DNS 提供商的性能。
有几种方法可以减少单个用户的 DNS 查找时间：
- 通过使用快速 DNS 提供商。如上面从 DNS 基准测试服务DNSPerf.com截取的屏幕截图中所列，有几项服务提供的全球平均延迟不到 30 毫秒，足以使 DNS 查找过程不易察觉。
- 使用更高的 TTL 缓存 DNS 响应。DNS 递归解析器可以将这些响应缓存到全球最终用户附近，并且可以进一步显着减少它们所服务的所有用户的 DNS 查找时间。
6. 为字体利用浏览器缓存
由于插件或主题在您的网站上使用的 Google 字体，您可能会获得 95 或 98 分而不是 100 分，并且您可能认为在这方面没有什么可以提高分数的；这个问题有不止一种解决方案。
Google 字体 CSS 仅提供 1 天的有效期。这是一项功能而不是错误，因为这允许 Google 字体团队更快地将更改传播给最终用户。但是，问题在于 PageSpeed 工具希望您对静态资产使用 30 天缓存。
如果您有兴趣解决这个浏览器缓存问题，您首先需要对自托管与第三方托管字体进行出色而详细的比较。
一种解决方案是使用一种为您下载字体和 CSS的工具。您只需要选择系列，并且您的向后兼容性首选项和可下载文件已准备就绪，您可以将其解压缩到项目内的目录中，并使用 HTML 中的 CSS 来提供字体。如果您使用 WordPress，OMGF 插件可以为您完成所有这些工作。
您还可以使用Easy Fonts，它是Google 字体的克隆，但添加了一些 CSS 实用程序类，可以更轻松地使用字体并促进快速原型设计。幸运的是，这个 CDN 托管库还修复了浏览器缓存问题。
7. 使用 HTTP/2 服务器推送
服务器推送是 HTTP/2 协议的一项功能，它允许 Web 服务器在请求此类文件之前先发制人地将文件推送到浏览器，以预期浏览器很快将需要请求这些文件。
因此，当服务器收到对文件的请求时，它将发送该文件以及一个或多个附加文件，这些文件被配置为与触发服务器推送的文件一起发送。这消除了后续请求的往返时间并使资源立即可供浏览器使用。
服务器推送是您可能想尝试的一项重要性能功能。但是，需要注意的一件重要事情是不要在每个请求上都积极推送文件。浏览器可能已经为您提供了资源的缓存副本，并且浏览器必须有使用该缓存的空间。积极推送太多不需要的资源可能会浪费用户可能在计量连接上的带宽。
如果你想尝试这个，这篇文章详细解释了如何为 NGINX 设置服务器推送。这篇关于 CSS-Tricks 的文章有助于设置缓存感知服务器推送设置。这篇博文有很多关于使用服务器推送的建议和见解。对于 WordPress 站点，相同的 Easy Speedup 插件提供了此服务器推送功能。
8. HSTS 预加载你的主机
HSTS 或 HTTP 严格传输安全性是一种强制 HTTPS 的方法，以确保如果用户使用普通的旧 HTTP 请求页面，入侵者不会有机会更改请求或响应。
HSTS Preload是由 Google Chrome 团队维护的一个列表，用于为整个域及其子域认可 HTTPS 的此类网站创建目录。大多数主要浏览器供应商都使用此域列表，包括 Chrome、Firefox、Opera、Safari、Edge 和 IE。如果某个网站在此 HSTS 预加载网站列表中，则浏览器始终会与其建立安全连接。即使用户尝试通过未加密的 HTTP 打开此类站点，浏览器也会查找列表中的网站并将请求更改为 HTTPS。
正如 HSTS Preload 网站上提到的，这种技术有几个要求，但提供了更高的安全性。然而，安全并不是唯一的好处。如果网站有多个旧的反向链接，在此列表中拥有一个网站可以避免用户从 HTTP 到 HTTPS 的不必要重定向。HSTS 的安全性和性能优势证明其使用是合理的，前提是您可以满足其要求。
9. 使用不可变缓存
'Cache-Control' 是一个 HTTP 标头，它告诉浏览器文件可以在浏览器中存储多长时间。对于用户特定的动态内容（如 HTML 页面），此标头用于告诉浏览器永远不要缓存此文件。但对于图像、CSS 和 JS 等静态内容，此标头成为为同一用户的重复访问节省大量带宽的最重要的单一来源。
但是，没有适合所有静态资产的单一缓存控制配置。一些静态资产变化很大，而另一些则根本没有变化。例如，如果您的站点上存在名为 jquery-3.4.1.min,js 的资源，并且您确定永远不会编辑此文件，则需要某种方式告诉浏览器此文件永远不会更改。
幸运的是，使用新的“不可变”指令，您现在可以告诉浏览器完全相同。如果浏览器看到为资产设置的'cache-control: immutable'标头，这会告诉浏览器该文件永远不会更改，并且浏览器不应尝试使用条件 'If-Modified-Since' 请求验证新鲜度文件。
这节省了往返时间并使缓存的资产无需重新验证即可使用。但是，您需要确保此标头不会与大部分保持不变但每年可能会进行一两次编辑的文件一起使用，因为在这种情况下，如果没有适当的缓存失效，编辑可能无法到达某些用户. 最适合此标头指令的是将版本号添加为 URL 的一部分的开源库、具有唯一 ID 或名称的用户上传图像，以及每次更改后获得唯一 URL 的 CSS 和 JS 包。
10. 利用主机整合
主机合并通过消除经典和附带的域分片开销来加速其客户的网站。您可以轻松地将这种方法用于您自己的网站。通
主机整合与域分片技术相反。它依赖 HTTP/2 来并行交付请求的资源，并通过单个主机（或域）代理所有外部资源，以避免不必要的 DNS 查找和连接成本。这种节省的连接和 DNS 查找开销可以为移动和桌面用户加快网站速度。
我们可以使用相同的原理在任何网站上实现相同的行为。
- 避免过多的开源 CDN。如果您的站点从多个不同的 CDN 加载多个开源库，请尝试从单个 CDN 加载所有这些库。
- 下载并自行托管 Google 字体。对于 WordPress 网站，OMGF 插件只需点击几下即可为您完成工作。
- 抛开旧的域分片技术，从单个主机加载所有资产，而不是为并行内容交付创建分片。让 HTTP/2 为你做并行化。
- 如果您的网站使用来自多个主机的静态内容，请考虑通过单个主机代理所有内容。
11. 避免使用 CSS Sprite
“CSS sprites”是一种将多个图像组合成一个大图像并使用 CSS 在网页的不同位置显示来自它的适当像素的技术。几年前，这曾经是一种非常常见的技术。
缺点是这使得整个页面结构复杂且不太灵活。此外，即使只需要使用一个箭头，也需要加载大图像，这会增加页面的整体重量。通过精灵添加另一个图标非常耗时，因为您必须首先修改图像并确保它不使用网站上其他地方使用过的任何像素。这可能会导致网站设计中的几个错误。类似地，更改一个显示大图像中图标的 HTML 元素的大小将需要您调整大图像上的图标大小并重新定位图像上出现在该图标之后的所有图标。
这很复杂并且几乎没有任何好处，因为 HTTP/2 可以为您完成几乎相同的工作。HTTP/2 可以在同一个连接上复用多个请求和响应。不使用 CSS 精灵的另一个好处是，只有页面上绝对需要的此类图像或图标才会加载。浏览器甚至可以优先考虑折叠图标上方，并将它们放在折叠图像下方以备后用，进一步加快页面加载速度。
因此，如果您对小图像使用“CSS Sprites”，最好让它们自由加载并让浏览器决定如何优先处理它们的请求以及一次请求哪一个。
12. 经常更新
WordPress 5.5 即将发布，并将添加对本地延迟加载图像的支持。因此，依赖插件来使用此功能的站点现在将在 WordPress 核心中内置一个本地延迟加载解决方案。
延迟加载是一项重要的性能优化，在这种情况下，只需单击一下即可将 WordPress 更新到下一个版本，数百万个网站都可以使用它。
定期更新 CMS、插件、主题、工具、服务器软件、语言运行时甚至操作系统会带来显着的性能改进。例如，新的 PHP 版本的每个版本都带来了相当大的性能改进，而且在可预见的未来，随着 PHP 8即将推出新的 JIT 编译器，这种趋势似乎还会继续。Node.js 的情况也是如此，它受益于 V8 JavaScript 引擎的每个新版本带来的新速度和内存优化。
这同样适用于 NGINX 或 Apache 等服务器软件。服务器开发人员目前正在致力于名为 HTTP/3 的 HTTP 的下一个重大更新。HTTP/3 承诺使互联网连接更快、更可靠和更安全。一旦您最喜欢的服务器提供此功能，请务必应用此更新。
软件早期版本的性能通常没有得到很好的优化，因为在这个阶段，速度通常不是第一偏好。但是随着产品的成熟，开发人员可能会开始投入更多精力使其更快以适应更多用户并与替代选项进行更好的竞争。因此，随着每个软件的新版本都可用，更新以避免错误、利用安全修复并加快堆栈速度是一个很好的做法。
