WordPress网站性能优化:24个访问速度优化技巧(上)

网站访问速度优化是个比较大的话题，涉及到方方面面，需要调整的地方也是非常多的，本篇文章将诠释所有需要优化的关键点，当然了，此类优化操作如果涉及到技术细节那就很多知识点了，所以这里不会详细阐述很细的技术点，只会提到对应优化的关键点，然后基于插件的形式解决问题。

为什么要优化网站的访问速度

对于网站访问速度，我想不多说大家也能感受到，如果一个网站打开非常慢，你觉得你还会继续访问这个网站吗？如果是我遇到这样的情况，那么我会直接关闭此网站。

并且内心会涌现一个想法，连网站速度访问起来都这么慢，那说明这个网站其他方面做的也是不会好到哪里去的，大概率没什么高价值，所以不再访问此网站是最明智的选择。

除了上面提到的个人原因之外，还有对网站本身影响非常大的因素如下：

• 如果网站是类外贸电商的独立站，那么访问速度慢会直接导致客户丢失，影响订单转化率。
• 网站有流量依靠SEO的情况下，网站速度慢会直接影响网站的排名。

基于上述我提到的这些原因，网站的访问速度优化是必须要解决的一个问题，目前有一个评估网站访问速度快慢的标准，而且有两个视角，分别是个人电脑通过浏览器打开网站的访问速度和手机浏览器打开网站的访问速度。

• 个人电脑浏览器访问网站的速度不超过2.5秒就是符合要求的，否则就可以评估为网站访问速度慢。
• 手机浏览器打开网站的访问速度不能超过8.6秒，但是会随着技术的发展，手机访问网站的速度会更快。

确认并优先解决网站访问速度问题

在开始之前，我想直接告诉大家，要想优化网站访问速度，不能凭空直接说，这个网站访问很慢，哪个网站访问很慢的言辞，确认网站访问速度很慢是需要给出数据的，那么这个数据如何来呢？

数据的来源不用我们思考，Google官方已经给出了评估测试网站访问速度的产品，直接使用即可。

• https://pagespeed.web.dev/ 除了上述评估测试网站访问速度的产品外，还有一个产品也可以试试，可以进行交叉式测试，这样效果更好。
• https://gtmetrix.com/
• https://tools.pingdom.com/

通过上述提供的3个站点评估测试自己的网站访问速度是慢还是快，最终会得出一份带有评分的报告，然后基于此报告来决定优化哪些地方。

需要注意的地方：我有必要强调一下，一定不要执着迷恋上述工具评估测试出来的结果，一定要质疑此结果，不要看着上述工具给出的评分不怎么高，但实际你的网站访问速度已经是在2秒之内了，那么上述网站得出来的评分就没有参考的意义了。

常见网站访问速度问题

每个网站都是独立的，都是不一样的，对应的访问速度慢也是各种各样的问题，需要具体问题具体分析，以下是一些常见影响网站访问速度的问题，需要优先解决。

1. 网站图片未压缩，图片尺寸非常大，图片文件大小很大。
2. 过时PHP版本，意思就是PHP版本很低，基本是已经废弃的PHP版本。
3. 过于臃肿的网站主题。
4. 网站安装使用的插件太多了，这里提醒大家，一般插件最多不要超过10个，最好是8个插件，或者更少。
5. 网站模板受众的用户所在地理位置访问网站的位置距离太远，意思就是，目标受众用户在新加坡，但是你的网站数据中心位置离新加坡很远。

臃肿主题的理解：

在网站速度优化的计算机领域中，“Bloated theme”指的是一个主题（Theme）或模板（Template）在设计和功能上过于臃肿和臃肿，导致网站加载速度变慢。这种主题可能包含过多的功能、元素或代码，使得网站在加载和显示时变得缓慢和笨重。优化网站速度的过程中，通常会考虑避免使用Bloated theme，以提高网站的性能和用户体验。

排好优先级优化网站

在优化网站访问速度的过程中需要考虑各方面的因素，因此就会存在优化的操作会非常多，既然优化的操作非常多那么势必就会涉及到哪个优化操作简单且效果明显的问题，所以此时就需要根据当前优化网站的解决办法进行优先级排列。

假如当前有一个网站需要优化，而且也整理出来了，哪些可以操作的优化点，然后基于这些可以操作的优化点进行优先级排列，由易到难，由效果显著到效果不咋明显的操作执行。

网站托管必要条件

做自己的独立站，选择一个高性能服务提供商是非常有必要的，服务提供商选择的好，后面网站优化方面会省事很多。

选择高性能WordPress主机托管

选择高性能WordPress主机托管商，需要看下面几个条件是否有，如果有就可以纳入考虑的范围之内：

1. 具备高级缓存功能，例如：可以做动态缓存和静态缓存。
2. 具备强制开启HTTPS的功能，且支持HTTP/2。
3. 最好也能支持Fix Insecure Content的功能。
4. 含有CDN（Content Delivery Network）功能。
5. PHP响应速度优化，确保PHP版本具备更快的响应页面，更低的服务器内存使用和其他整体性能优化。
6. 优化了MySQL的处理过程。

选择目标网站受众最近的数据中心

这个从字面意思就很好理解，就是使用VPS或者虚拟主机的时候，选择的地理位置必须是要跟你的目标网站受众距离最近，哪个数据中心跟目标网站受众最近就选哪个数据中心。

除了上述首要考虑的因素之外，还需要考虑以下因素：

1. 所选择的这个数据中心能够提供快速连接和较低的延迟。
2. 说到速度和延迟就不得不提到TTFB -这个速度度量是指由客户端的浏览器接收到的HTTP请求的第一个字节所需的时间。
3. 确认目标服务提供商的CDN功能是否有自己目标网站受众最近的数据中心。

页面大小和内容优化

页面大小和内容优化是网站性能优化的关键组成部分，也是比较麻烦的部分，具体操作起来需要根据实际情况操作，而且需要充分熟悉和理解自己网站的功能。

减少索引页面的体积和大小

这个操作直白的点讲就是告诉你每次打开某个页面不要加载太多东西，把重要的信息加载出来就可以了。

例如：首页的加载就不要放很多博客文章，比如把所有博客文章按照分页的形式全部显示出来，那么这种操作势必会对网站的访问速度有很大的影响，所以此操作不利于网站的性能，需要禁用。

当然了，有一种Ajax技术可以按需加载，针对WordPress已经提供了插件，可以参考：

• https://wordpress.org/plugins/ajax-load-more/

在索引页面上拆分长文章

字面意思就能理解，意思就是将一篇长文章拆分成多个页面文章，当用户访问查看的时候，访问了一部分显示下一页，然后继续查看。

用一张静态图像替换包含多张图片的滑动条

如果之前没接触过，或者没有仔细观察，那么这个从字面意思来理解可能不怎么好理解，我接触到的很多网站会给你展示一个相册集，然后你看一张就可以使用鼠标滑动（鼠标左键拖动滑动条）向后看下一张，这种形式的展示就是上面说的多张图片滑动条。

在网页涉及或者内容展示中，原本使用一个包含多张图片的滑动条（slider）来展示内容，现在改为只使用一张静态的图片来代替，这样操作的目的是为了简化设计、提高页面加载速度或改善用户体验。

如果有需求推荐下面两个插件，选择其中一个即可，一个收费的一个免费的。

• https://wordpress.org/plugins/ml-slider/
• https://wordpress.org/plugins/soliloquy-lite/

使用适当的图像大小

这个就很好理解了，主要是要求网站选择图像的时候尽量选择像素适中或者说很小符合当前网站要求的图像。

我个人推荐使用图像的格式是WebP格式，如果不能使用此格式，那么其他格式的图像就需要进行适当的裁剪和压缩。

减少外部字体的使用

这个操作需要使用插件到完成，如果会技术那就另当别论，插件的功能需要具备字体优化和字体预加载功能，参考插件：

• https://wordpress.org/plugins/sg-cachepress/

管理网站的评论数量

使用默认的WordPress网站评论功能，进行设置即可。

在页面中启用Gzip或Brotli压缩

默认有两种压缩的方式，一种是Gzip，另一种就是Brotli。

Brotli是一种下一代压缩方法，其工作方式与Gzip相同。它是由谷歌开发的，并使用了更好的压缩算法，从而导致传输的数据的规模要小得多——大约比Gzip少20%，比未压缩的内容小400%！

要实现压缩功能，最简单的方法就是找到提供此服务的服务提供商即可，复杂点需要自己使用VPS搭建并配置。

压缩并合并JavaScript和CSS文件

压缩（Minify）和合并（Combine）JavaScript（JS）和层叠样式表（CSS）文件是提高网站性能的常见做法。以下是这两个步骤的详细解释：

1. 压缩（Minify）：

• 压缩是指去除JS和CSS文件中的不必要的字符，如空格、换行符、注释等，以减少文件的大小。
• 这样做可以加快文件的传输速度，因为较小的文件需要更少的时间来下载。
• 压缩后的文件仍然保持其原始功能，但代码的可读性会降低。

2. 合并（Combine）：

• 合并是指将多个JS或CSS文件合并成一个单一的文件。
• 这样可以减少HTTP请求的数量，因为浏览器每次请求一个文件都需要一个单独的HTTP请求。
• 减少HTTP请求可以显著提高页面加载速度，尤其是在网络条件不佳的情况下。

  延迟渲染阻塞的JavaScript

在网页加载过程中，某些JavaScript文件可能会阻塞页面的渲染，这意味着浏览器必须等待这些JavaScript文件下载并执行完毕后，才能继续渲染页面内容。这可能会导致用户在看到页面内容之前经历较长的等待时间，从而影响用户体验。为了优化页面加载速度，可以采取以下措施来延迟渲染阻塞的JavaScript：

1. 使用defer属性：
   1. 在HTML中，可以使用<script>标签的defer属性来指示浏览器在解析HTML文档的同时异步下载脚本，并在文档解析完成后执行脚本。
   2. 这样，脚本的下载和执行不会阻塞页面的渲染。
2. 使用async属性：
   1. 另一个选项是使用<script>标签的async属性，它允许脚本在下载时不会阻塞HTML解析，但一旦下载完成就会立即执行，这可能会在某些情况下仍然阻塞渲染。
3. 代码分割和懒加载：
   1. 将JavaScript代码分割成多个模块，并根据需要懒加载（即在用户实际需要时才加载），可以减少初始加载时需要处理的JavaScript量。
4. 优化关键渲染路径：
   1. 识别并优化关键渲染路径中的JavaScript，确保关键的页面内容能够尽快显示给用户。

  启用缓存技术

缓存技术细节话题太大，总之在选择服务提供商的时候选择提供各类缓存技术的服务提供商。