如何在WordPress中利用浏览器缓存

它可以令人沮丧地沉入你的时间和精力WordPress网站，才发现你的页面是滞后的。有什么是其他更快的网站做不到的?

一个可能的答案是浏览器缓存。

即使你是网页开发的新手，你也可能听说过在网页浏览和页面速度方面使用的术语“缓存”。你甚至可能清空了几次浏览器缓存。

在其核心，浏览器缓存的概念不是掌握或实施的艰难概念加快你的WordPress网站。实际上，您甚至不需要触摸您的服务器文件，因为存在可以为您处理后端工作的插件。并且，以来游客变得不耐烦需要几秒钟凭借您的负载时间，即使是小速增强也值得额外的努力。

在本指南中，你将学习什么是浏览器缓存，以及如何在你的WordPress网站上利用它，可以自己编辑你的服务器文件，也可以通过WordPress插件的帮助。

什么是浏览器缓存？

当Web浏览器临时存储在其设备上本地存储资源的副本时，会发生浏览器缓存，以便将来可以更快地加载资源。存储资源的本地磁盘上的空间称为“缓存”。reybet雷竞技下载

为了更好地理解缓存的基础知识，让我们回顾一下网站通常是如何工作的。当用户在浏览器中输入你网站的URL时，浏览器向你网站的web服务器发送一个HTTP请求，请求URL指定位置的网站资源。reybet雷竞技下载这些资源包括reybet雷竞技下载文本和图像、样式表和脚本等内容，以便在页面上实现。

如果一切顺利，您的Web服务器将请求的资源发送回浏览器，以及一些关于如何处理这些文件的额外说明。reybet雷竞技下载浏览器解析这些文件并将其作为网页显示给您的访问者。

然而，对于普通互联网用户来说，这些都无关紧要——他们想要的只是你的网页尽可能快地出现在他们的屏幕上。减少加载时间(或者，换句话说，提高性能)的一种常见方法是利用浏览器缓存。

启用浏览器缓存后，你的服务器会指示访客的浏览器在缓存中保存你的一些网站资源一段时间。reybet雷竞技下载然后，当访问者再次返回同一页面时，浏览器可以从缓存中提取资源，而不是再次从web服务器请求一个副本。取消了请求、接收和解析缓存项的过程，从而提高了总体加载速度。

图像源码

类似地，如果访问者跳转到您网站上的另一个页面，该页面使用了与前一个页面相同的一些资源——例如，重复的徽标或标题区域——他们的浏览器也可以从缓存中获取这些资源。reybet雷竞技下载

需要注意的是，缓存的内容几乎都是临时的。由服务器告诉浏览器可以缓存哪些资源以及缓存多长时间。reybet雷竞技下载这可能是一分钟，也可能是一到两年，这取决于你希望更新内容的频率。

缓存最好应用于静态内容。静态内容一旦上传到web服务器就不会改变——图像就是一个常见的例子。无论静态文件是从服务器上下载的还是从浏览器缓存中提取的，对用户来说都是一样的。

是否应该启用浏览器缓存?

简而言之，最有可能是 - 大多数流行的网站使用缓存来提高性能并保存带宽。要确定，您可以通过速度检查运行您的网站网站平地机或者Pagespeed见解并寻找与高效浏览器缓存相关的建议。

图像源码

如果您收到这样的通知，可能是因为您没有缓存静态资源，或者是因为缓存的内容过期得太快。reybet雷竞技下载

要解决此问题并加快WordPress站点，您需要将服务器配置为允许缓存内容。有两种方法可以这样做：首先，我会解释如何使用一些流行的WordPress插件进行缓存。稍后，我们将讨论如何通过直接编辑服务器文件来打开缓存。

如何在WordPress插件中利用浏览器缓存

Plugins对于可能不舒适地对其服务器文件进行更改的站点所有者是完美的。浏览器缓存插件将为您处理幕后工作，许多人也将通过其他方式帮助优化您的网站。在本节中，我们将审核三个此类插件以及如何打开每个浏览器缓存。

但是，在你的网站上安装缓存插件之前，确保你的网络主机可以接受它。许多主机提供商，包括和WordPress管理主机，禁止使用缓存插件，甚至可能禁止特定插件 - 不是因为它们是有害的，而是因为它们与当前服务器配置不兼容。在这些情况下，可能已经启用了浏览器缓存。通过关于缓存WordPress网站的问题，与您的托管支持联系。

现在，让我们解压这些插件。

WP火箭

在让你的主机为你处理浏览器缓存之后，WP Rocket插件是WordPress网站所有者最不插手的解决方案。WP Rocket是一个全面的速度优化插件，自动处理性能的许多方面，包括缓存。WP Rocket是一个高级插件，从49美元开始在一个网站上为一年的更新和支持。

WP Rocket在激活后立即将桌面和移动缓存应用到您的内容，但您可以在下面切换缓存设置设置> WP火箭。在这里，您将能够开启和关闭缓存，以及更改缓存寿命。缓存资产默认设置为10小时后过期，但如果您的网站频繁更新内容，您可能希望缩短这一时间，如果您的网站基本上是静态的，您可能希望延长它。

除了缓存外，WP Rocket还通过​​申请优化您的网站GZIP压缩到域上托管的文件，预加载某些资产，以及延迟加载图片。

WPMU DEV的蜂鸟

蜂鸟是一个成员WPMU DEV插件套件-这个特殊的插件致力于提高您的网站性能与几个措施，包括GZIP压缩，a内容分发网络(CDN)，正常运行时间监控和一组缓存功能。一个网站每月订阅为5美元，或者您可以每月15.83美元获得所有WPMU开发插件。

Hummingbird允许您在页面上启用几种形式的缓存，包括页面缓存和浏览器缓存。要在Hummingbird中启用页面缓存，请登录你的WordPress仪表盘并选择HummingBird Pro>缓存。然后，在里面页面缓存模块，点击启用。在此模块中，您可以根据您的网站上更改的频率致切换哪个元素 - 缓存对频繁更新的元素非常有用 - 以及什么设备和用户可以使用缓存内容。

要启用浏览器缓存，请向下滚动到配置区域，选择您的服务器类型，并为所有文件或单个文件设置您的到期时间。

图像源码

W3总缓存

迄今为止坐在多百万下载下，W3总缓存是一个领先的性能优化插件，用于缓存您的网页，缩小代码，懒人加载图像，并与CDN集成Cloudflare。它有一个免费版，每月8.25美元的高级插件 - 免费版提供缓存。

要打开缓存，请选择性能>常规设置，然后向下滚动到浏览器缓存勾选旁边的复选框使能够如果是无节制的。然后,单击保存所有设置。

接下来,选择性能>浏览器缓存。下一般，检查前五项。它们启用启用浏览器缓存的报头(从服务器发送到浏览器的HTTP指令)。

最后，您需要为特定的文件类型设置过期时间。expires头告诉浏览器存储站点文件副本的时间。

您可以为CSS和JavaScript文件，HTML设置单独的过期标题XML.文件和媒体文件。下性能>浏览器缓存，滚动到CSS＆JS.部分，勾选旁边的复选框设置过期标题并输入你的Expires标题一生值在秒。缺省情况下，该值为31536000秒，即365天。将此值调整为对CSS和JavaScript文件最有意义的值——例如，两周的过期时间为1209600秒。

在下面重复这个过程HTML和XML和媒体和其他文件部分,然后点击保存所有设置。

如何通过直接编辑文件来利用WordPress中的浏览器缓存

如果您可以访问您的服务器文件，并且愿意对它们进行直接修改，您可以添加启用浏览器缓存的指令。

首先，尽可能小心，每当制作这样的编辑时都会谨慎使用。任何错位或错误的代码都可以立即使您的网站立即不可用，也可以与服务器的配置冲突。如果您还没有，我们建议您致电服务器支持权限和任何指导，特别是如果您是编辑服务器文件的新功能。也是，总是创建您网站的备份在做出重大变化时。

为了利用浏览器缓存，您的修改将指示服务器使特定的文件可缓存一段特定的时间。你将在你的HTTP响应中添加两个头:缓存控制，它指定可以缓存多长时间和文件，以及到期，它告诉浏览器缓存文件有效的时间。

添加这些标题的过程根据您的服务器软件而异。雷竞技苹果下载官方版在本节中，我将介绍如何在最常见的配置，apache和nginx上启用浏览器缓存。

如何在Apache服务器上利用浏览器缓存

如果您的网站存储在Apache服务器上，您将使您的站点更改. htaccess文件位于主Wordpress目录中（通常public_html.)。. htaccess包含各自目录的指令和权限的文本文件，那么. htaccess根目录控件适用于整个站点。

编辑. htaccess，通过托管面板或使用FTP客户端。导航到根WordPress文件夹。如果你看不到. htaccess在那里，您可能需要透露隐藏文件。如果你仍然没有看到. htaccess在显示隐藏文件后，这意味着它不存在于根文件夹中。在本例中，只需创建一个新. htaccess这个文件夹中的文件这是惠达林格的指南如何做到这一点。

定位或创建主要后. htaccess文件，在托管面板文件编辑器中打开文件，或下载文件并在代码/文本编辑器中打开它。这是您将在哪里进行必要的更改。

在Apache中设置Cache-Control Header

首先，让我们设置Cache-Control header。在文件的底部添加以下代码#结束WordPress：

< filesMatch”。(ico pdf | | flv | jpg | jpeg | png | gif svg | | js | css | swf) $ " >
Header set Cache-Control "max-age=31536000, public"

这将缓存应用于所有在第一行中列出的扩展名的文件，设置最大过期日期为31536000秒(即365天)，并声明文件可以缓存在公共服务器上，如CDN。你可以改变上市至私人在上面的代码中指示浏览器仅将缓存文件存储在客户端计算机上。

或者，您可以按文件类型设置不同的缓存控制标题。例如：

< filesMatch \”。(jpeg | jpg | png | gif svg | |) $ " >
Header set Cache-Control "max-age=31536000, public"


Header set Cache-Control "max-age=31536000, private"

这段代码允许公开缓存图像文件，而将.js和.php文件限制为私有缓存。

设置Apache中的标题

接下来，添加您的Expires Header以告诉浏览器何时用新版本替换缓存的文件。粘贴下面的缓存控制规则下面的代码：

< IfModule mod_expires.c >
ExpiresActive上
ExpiresByType Text / HTML“访问1200秒”
ExpiresByType Text / CSS“Access 1个月”
ExpiresByType text/javascript "access 1 month "
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType Image / JPEG“Access 1年”
ExpiresByType Image / JPG“Access 1年”
ExpiresByType图像/png "访问1年"
ExpiresByType Image / SVG“Access 1年”
ExpiresByType Image / GIF“Access 1年”
ExpiresByType应用程序/ PDF“Access 1个月”
ExpiresByType应用程序/ JavaScript“Access 1个月”
ExpiresByType应用程序/ X-JavaScript“Access 1个月”
ExpiresByType应用程序/ XHTML + XML“Access 1个月”“
ExpiresByType应用程序/ X-Shockwave-Flash“Access 1个月”
ExpiresByType Image / X-Icon“Access 1年”
ExpiresDefault“Access 1个月”

在这里，每一个ExpiresByType.将到期时间分配给文件类型。这些值未设置为石头 - 您可能需要更改时间以最适合您的需求。通常，图像文件很少更改，并且可以长时间缓存。

最后一行是对上面未指定的任何文件类型的捕获。这里，它默认为1个月。

编辑完成后，保存文件(如果有必要，可以通过FTP重新上传)，然后在隐身浏览器中重新运行速度测试，看看你的页面表现如何。

如何利用浏览器缓存在nginx服务器上

要指示nginx服务器添加缓存控制并过期标头，请打开配置文件（相依）在您的服务器面板编辑器（或在代码编辑器中）中进行以下更改。

在nginx中设置缓存控制标题

在配置文件中的服务器块中下面的代码粘贴：

~* \.(ico|pdf|flv|jpg|jpeg|png|gif|svg|js|css|swf)$ {
到期365d;
add_header缓存控制“public，no-transform”;
}

这将指定文件类型设置为365天的最大过期期。您可以自由更改此时期和/或包含的文件类型。它还使这些文件公开可缓存（例如CDN服务器），而不是私下在浏览器本地存储中。使您的资产私下缓存，更改上市至私人在上述代码。

设置Nginx中的Expires Header

在同一服务器块中，将此代码粘贴以添加过期标头：

位置~* \.(jpeg|jpg|png|svg|gif)$ {
到期365d;
}

这将设置您的图像资产在一年后到期。对于有较短/较长的过期时间的文件，在同一节中重新粘贴这段代码，替换文件扩展名，并插入一个不同的时间段，如下所示:

位置〜* \。（HTML | CSS | JS）$ {
到期后30 d;
}

完成这些更改后，保存您的相依文件并重新启动nginx。重新运行隐姓埋名浏览器的速度测试，以了解您的页面如何执行。

如果你的负载时间没有改善怎么办？

无论你是自己配置服务器文件还是使用插件来完成这些工作，大多数WordPress站点都可以从浏览器缓存中获益。如果你不利用这个功能，你和你的访问者就会错过一个至关重要的速度提升。

一旦您实现了更改，通过先前使用的相同速度测试运行您的网站。确保以隐身模式运行您的网站，因为这不会加载任何已缓存的文件。

如果您仍然没有看到性能的改善，有一些可能的解释。首先，您可能想稍微调整一下缓存设置，确保过期时间足够长，并且正在缓存大型静态图像。

但是，这个问题的另一个可能原因是第三方脚本过多。将第三方工具（如CRM软件，Analytics Tools或其他应用程序）集成，这些应用程序雷竞技苹果下载官方版中的所有脚本都在页面上。您无法控制这些脚本文件如何缓存，因为它们不会来自您的Web服务器。因此，您可能希望考虑切换或放弃某些工具，以便以换取更好的性能 - 从您的页面加载中刮起一点时间可能是值得的。