如何为静态资源提供高效的缓存策略？

Google PageSpeed Insights是评估网站性能的工具之一。但是它的一些建议(比如“使用高效缓存策略提供静态资源”的警告信息)可能会让没有经验的站长感到困惑。

分解一下，缓存就不难理解了。通过一些调整，实现网站上最好的代码，减少加载时间，提高PageSpeed评分。

在本文中，我们将用警告信息“为静态资源提供高效的缓存策略”来解释它，然后分享一些解决这个问题的技巧。

如何理解如何为静态资源提供高效的缓存策略？

采用高效缓存策略提供静态资源的具体措施

如何理解如何为静态资源提供高效的缓存策略？

为了理解“为静态资源提供高效的缓存策略”这一警告信息，先了解一下Google PageSpeed Insights是有帮助的。如果你是这个平台的新手，建议先阅读完整指南《如何在Google PageSpeed Insights测试中拿满分》。

使用高效的缓存策略提供静态资源是Google PageSpeed返回的众多“诊断结果”之一，可以作为提高分数的建议，如下:

Google PageSpeed Insights的缓存策略

Google建议使用浏览器缓存来减少页面加载时间，提高性能。简而言之，缓存意味着用户的浏览器保持站点页面的静态副本。然后，在后续的访问中，可以更快地重新加载这些内容，因为浏览器可以在不连接服务器的情况下访问所请求的静态资源。

但是，每个缓存资源都需要指定的到期日期。这将告诉浏览器你网站上的内容何时过期，并在过期后用新版本替换其缓存副本。

如果您在性能测试结果中看到警告“使用高效缓存策略提供静态资源”，这可能意味着以下两种情况之一:

您的站点服务器或第三方服务器缺少Cache-Control或Expires标头。

有需要的头，但是有效期很短，所以对性能没有太大影响。

采用高效缓存策略提供静态资源的具体措施

你可以根据原因用几种不同的方法修复WordPress网站上“用高效缓存策略提供静态资源”的警告。可以尝试以下三种解决方案。

1.添加缓存控制并终止标头。

有两个与浏览器缓存相关的头:缓存控制和过期。至少要有一个才能为您的站点启用浏览器缓存，因为这是浏览器决定资源在刷新前应该保留多长时间的方式。

确定这是否导致“提供具有高效缓存策略的静态资源”警告的一个简单方法是查看每个资源的详细信息。在最新版本的Google PageSpeed Insights中，你会在“缓存TTL”下看到“无”:

在Google PageSpeed Insights中缓存TTL列表

或者缓存有效期过短，最新版本的Google PageSpeed Insights会被列入“为静态资源提供高效缓存策略”的警告列表，但是“缓存TTL”显示的是缓存有效期:

浏览器缓存资源缓存的有效期太短。

当Cache-Control标头启用客户端缓存并设置资源的最大生存期时，Expires标头仅用于指定缓存资源的生存期。

Expires引入并提供了比HTTP/1.1中的Cache-Control更多的选项。它们可以用来完成同样的事情，但是Expires的数据值是HTTP date，而Cache-Control max-age允许您指定一个相对的时间量，以便您可以指定“页面被请求后的x小时”。

HTML缓存控制也是一个很类似的问题，和缓存教程有很好的链接，可以回答你的大部分问题(比如，[http://www.mnot.net/cache _ docs/# Expires)。)综上所述，当你需要对缓存的方式有更多的控制时，建议对图片、Cache-Control等静态资源使用expires。经由itranslater.com

不必两者同时添加，因为可能是多余的。通常，推荐使用更新的缓存控制。但是，一些Web性能工具(如GTmetrix)仍然会检查Expires头。

如何在Nginx中添加Cache-Control缓存控制头

要在Nginx中添加缓存控制头，可以将以下内容添加到服务器的Nginx配置文件中:

location ~* .(js|css|png|jpg|jpeg|gif|svg|ico)$ { expires 30d; add_header Cache-Control “public, no-transform”;}

这告诉您的服务器，指定的文件类型至少在30天内不会更改。

如何在Apache中添加Cache-Control缓存控制头

如果您使用的是Apache服务器，可以将下面的代码添加到。htaccess文件:

Header set Cache-Control “max-age=84600, public”

这段代码应该放在“#BEGIN WordPress”之前或“#END WordPress”之后。在这种情况下，缓存设置为在84，600秒后过期。

如何在Nginx中添加缓存控制缓存有效性头

通过向服务器ng配置文件添加以下内容，可以在Nginx中添加Expires头。在此示例中，您可以看到如何根据文件类型指定不同的到期时间:

location ~* .(jpg|jpeg|gif|png|svg)$ { expires 365d;}location ~* .(pdf|css|html|js|swf)$ { expires 2d;}

如何在Apache中添加缓存控制缓存有效性头

您可以在Apache中添加Expires头，方法是在。htaccess文件:

## EXPIRES HEADER CACHING ##ExpiresActive OnExpiresByType image/jpg “access 1 year”ExpiresByType image/jpeg “access 1 year”ExpiresByType image/gif “access 1 year”ExpiresByType image/png “access 1 year”ExpiresByType image/svg “access 1 year”ExpiresByType text/css “access 1 month”ExpiresByType application/pdf “access 1 month”ExpiresByType application/javascript “access 1 month”ExpiresByType application/x-javascript “access 1 month”ExpiresByType application/x-shockwave-flash “access 1 month”ExpiresByType image/x-icon “access 1 year”ExpiresDefault “access 2 days”## EXPIRES HEADER CACHING ##

然后，您可以再次通过Google PageSpeed Insights运行网站，看看浏览器缓存警告是否仍然存在。

2.谷歌分析统计代码浏览器缓存策略

具有讽刺意味的是，有时Google Analytics的Google statistics代码的JS文件也被Google PageSpeed Insights识别为未优化的静态资源:

Google统计JS代码

您将无法使用Cache-Control或Expires标头更改此设置，因为资源不在本地服务器上。不过有一种方法可以缓存浏览器，就是把Google Analytics统计代码的JS文件存储在本地服务器上。

但是，请注意，Google不支持这种方法。

(1)使用插件CAOS缓存Google Statistics的JS脚本。

如果你想解决上述问题，你可以使用完整的分析优化套件(CAOS)，这是一个由金奎大·范登伯格开发的免费插件:

CAOS插件

你可以从WordPress插件市场下载CAOS，也可以在WordPress仪表盘的“插件”>“安装插件”中搜索安装。

本地存储分析脚本文件的其他好处包括将对Google的外部HTTP请求从两个减少到一个，并且让您完全控制文件的缓存。这意味着您可以使用前面提到的缓存头。

首先，请安装插件，然后输入您的谷歌分析跟踪ID。这个插件将Google Analytics(Google Statistics)必要的跟踪代码添加到你的WordPress网站上，下载analytics.js文件并保存到你的服务器上，用wp_cron()中预定的脚本更新它。

还建议将其设置为页脚加载:

CAOS跟踪代码位置设置

温馨提示:CAOS不能与其他Google Analytics相关的WordPress插件一起使用。

(2)使用插件WP-Rocket在浏览器中缓存Google Statistics的JS脚本。

或者，你可以使用WordPress缓存插件WP-Rocket来达到同样的目的:

WP-Rocket插件

该插件的Google tracking组件可以实现Google统计脚本的本地托管。只需在WP-Rocket >附加组件下启用此功能即可。

WP-Rocket及其组件兼容其他与谷歌统计相关的插件。不过作为专业插件，价格不菲，49美元/年起。

3.尽量减少第三方脚本的使用

有时，由于Google Analytics的脚本文件托管在Google服务器上，它可能会影响您的Google PageSpeed Insights得分，因为您无法控制它的缓存机制。

其他第三方脚本也是如此。如果你通过WordPress网站管理业务，你很可能会运行其他第三方脚本来跟踪转换、A/B测试等。

这可能包括百度统计、百度站长联盟、阿里妈妈广告联盟、CNZZ统计、51统计、疯狂彩蛋、Hotjar等脚本。不幸的是，除非您找到一种在本地服务器上托管这些脚本的方法，否则您对此无能为力，并且您根本无法控制它们。

理想情况下，如果你想提高你的Google PageSpeed分数，你应该尽量减少使用第三方脚本。

总结

虽然Google PageSpeed Insights不能绝对评估你网站的性能，但是它仍然可以帮助你更好的了解网站性能的瓶颈。通过解决“提供具有高效缓存策略的静态资源”下的警告信息来提高分数，可以将网站的加载性能提高到一个更高的水平，提高网站的用户体验。

如果您在Google PageSpeed Insights中看到此警告，您可以通过以下方式解决此问题:

添加Cache-Control或Expires标头。

使用浏览器缓存编写谷歌分析统计代码。

尽量减少第三方脚本的使用。