你想加快你的WordPress网站？ 想知道可以帮助您减少网站加载时间的WordPress优化技巧吗？ 在本文中，我们将向您展示如何通过分享我们如何优化我们的List25网站以提高性能来加速WordPress。
你可能已经听说WordPress的速度对搜索引擎优化很重要。 更快的网站有更好的用户参与度，更多的综合浏览量和更好的销售量。 在一个奇怪的案例研究中，他们发现，一秒钟的延迟可能会导致销售额的7％，浏览量减少11％，客户满意度下降16％。
那么你怎么实际上加速WordPress？
那么，我们决定做一个完整的案例研究，向您展示我们的List25网站的结果以及我们如何完成这一切。
概观
List25是由我们的创始人Syed Balkhi创办的娱乐博客。 该网站拥有超过150万的用户，YouTube频道超过四分之一 BILLION 观点。
网站上的内容主要是图片和视频，占据了TB级的带宽，所以整体速度的优化对于我们降低成本，减少页面丢弃和缩短网站访问时间至关重要。
在我们开始优化之前，根据Pingdom，我们的主页加载了2.21秒。 我们完成后，我们的页面加载时间下降到1.21秒 （快45％） 。
在此优化过程中，我们能够加快服务器响应时间，提高页面速度性能得分，减少总请求次数，并缩短整体加载时间。
让我们来看看帮助我们加快我们的WordPress网站的优化技术。
WordPress主机
拥有一个好的网络主机对于您的网站速度至关重要。 随着我们的网站变得越来越流行，我们只是超过了我们以前的托管公司（HostGator）。
他们的服务器根本无法处理这个大小的网站，因为List25收到了几千万的浏览量。 HostGator适用于较小的网站，但不适用于这么大的网站。
我们查看了各种托管WordPress托管选项，并最终结束了使用SiteGround托管List25，因为他们提供了这个网站的最佳整体价值。
您可以立即看到服务器响应时间的改善。 我们从最大442ms到172ms的响应时间。 这是256％的改善。
Siteground为WordPress，Joomla和Magento等特定平台构建了性能增强器。 基于您的网站平台，他们特别优化您的服务器，从而获得更好的整体性能。
我们写了一篇关于什么时候应该改变你的虚拟主机的文章，里面谈到了7个关键指标。
现场
缓存插件
当谈到加速WordPress，缓存是您的网络托管后第二个最重要的因素。
通常，当访问者访问您的WordPress站点时，您的服务器会将PHP请求传递给MySQL数据库，该数据库将查找正在请求的页面，并将其生成并显示给访问者。 这占用了大量的资源。 当你有缓存时，它节省了时间和资源。
下图强调了这个过程。 通俗地说，将缓存视为创建桌面快捷方式，可以帮助您更快速地访问文件。
对于List25网站，我们正在使用SiteGround SuperCacher，这是他们为客户特制的插件。 最重要的是，他们使用Varnish（他们的性能增强器的一部分）添加了高级动态缓存选项。
如果你不在Siteground上，那么别担心。 您可以使用W3 Total Cache或WP Super Cache等众多可用解决方案之一在您的WordPress站点上设置缓存。
我们正在使用W3 Total Cache，它提供了一些页面缓存选项，数据库缓存和对象缓存。
随着越来越多的托管公司专注于WordPress，我们将看到更多的定制缓存解决方案。 Pagely和WPEngine还提供了自己的内置缓存系统。
CDN
内容分发网络（CDN）可以帮助您提高网站速度。 自List25开始我们一直在使用MaxCDN，所以这部分没有改变。
我们已经写了一篇关于什么是CDN的完整文章，以及为什么你需要一个信息图表。
CDN允许我们提供来自内容传送网络的所有CSS，Javascript和图像。 这通过确定站点访问者的位置以及从离访问者最近的服务器提供内容来工作。
如果您没有进入高端CDN解决方案的市场，那么您可以使用Cloudflare。
合并文件以减少HTTP请求
添加更多插件时，通常会添加自己的JavaScript和CSS文件。 每个附加文件都是一个新的HTTP请求。
我们将这些JavaScript和CSS文件合并为一个文件，以减少请求并加快加载时间。 你可以看到更多关于WordPress插件如何影响加载时间的细节。
虽然我们现在正在加载一些我们可能不需要的小功能，但是这些代码被缓存在CDN上，结果表明，对于文件的请求比加载几个较小的JS文件提供更好的性能。
这是你必须定期做的事情，因为你使用的插件改变了加班。
图片精灵
我们使用了一个图像精灵，它将几个社交和网站图标组合成一个图像：
每当我们需要显示一个特定的图标，我们会使用CSS来：
- 加载图像作为背景图像
- 定义我们需要图标的元素的宽度和高度
- 设置我们的图像的背景位置加载必要的图标
例如，要加载侧边栏的社交媒体图标，我们使用：
li.widget_social_icons ul li {float：left; 宽度：36px; 身高：36px; 保证金：0 10px 10px 0; 填充：0; 背景：url（../ images / sprite.png）no-repeat; }
li.widget_social_icons ul li.twitter {background-position：0 -50px; }
li.widget_social_icons ul li.facebook {background-position：-36px -50px; }
li.widget_social_icons ul li.pinterest {background-position：-72px -50px; }
li.widget_social_icons ul li.google {background-position：-108px -50px; }
li.widget_social_icons ul li.rss {background-position：-144px -50px; }
li.widget_social_icons ul li.youtube {background-position：-180px -50px; }
该 背景位置 ， 宽度 和 高度 CSS属性可以帮助我们定位想要输出的图像的特定部分：
结果，只有这个图像文件的第一个请求是使用带宽。 随后向CDN请求图像将导致加载缓存的（通常为本地的）版本，并且仅需要请求单个图像与6个不同的社交图标。
通过将JavaScript，CSS和图像组合在一起，我们显着减少了请求的数量。
代码缩小
代码缩小包括删除空格和换行符，以减小文件大小，使其在请求时加载更快。
对于List25，我们使用SCSS，一个基于语法的样式表（Intro to Sass）。 这使得我们可以在易于阅读的布局中跨多个开发领域构建我们的CSS文件：
我们使用CodeKit将SCSS文件编译成单个CSS文件。 CodeKit还会删除空格和换行符以确保文件尽可能小：
因此，我们能够将CSS文件大小减少28％。
图像优化
我们在两个方面优化了我们的图像：我们的WordPress主题和上传的内容。
对于我们的WordPress主题，我们使用CodeKit来确保所有图像都是无损压缩的。 这确保了文件的大小尽可能小，而不会损失质量。
我们还教育我们所有的作家关于保存为网络优化的图像的重要性。
无Javascript的社交分享
与其他网站一样，List25的社交分享非常重要。 然而，社交分享插件可以显着减慢您的网站。
虽然整合这四个社交网络的脚本在我们的测试中并未影响页面加载时间，但在移动设备上观看时，它显着减慢了网站的速度。 社交分享按钮将需要几秒钟的时间才能出现，尽管脚本异步加载，导致后期内容随着按钮加载到视图中移动。
为了解决这个问题，我们转向了一个（几乎）无Javascript的解决方案。 每个社交网络的分享按钮都由我们的自定义WordPress插件呈现，而主题的Javascript仅用于在用户单击按钮时打开Web浏览器窗口。
但是，我们仍然希望显示所有社交网络中的帖子总共有多少个。 为此，我们制作了一个小型自定义WordPress插件，用于检索每个社交网络的社交分享数量并将其缓存到Post元表中。 这些计数每24小时更新一次，确保耗时的查询不会持续运行。
您可以使用Sharre之类的API，也可以剖析Floating Social Bar以进行自定义。
使用Pingdom的RUM（真实用户监控），这个新的共享插件将“真实”页面加载时间从6秒缩短到2秒以上。 它也确保我们减少了对第三方脚本的请求数量。
结果
我们显着提高了网站速度。 加载时间从2.2秒到1.22秒。
我们能够显着减少服务器响应时间。
这有助于减少Google bot下载页面所花费的时间，这有助于我们的抓取速度。
我们的整体跳出率下降了7％，因为网站加载速度更快，通过切换主机，我们可以减少服务器错误。
正如你可以想象的，跳出率较低，在网站上花费的时间也超过了30秒。
结论
正如你可以看到一个更快的加载网站可以提高访问者的参与度。 我们讨论的技术涵盖了一系列基本和中间的改进，您可以使用这些改进来优化WordPress网站。
我们希望这篇文章能帮助你加速你的WordPress网站。 你可能也想看看我们的文章大约20个必须有2015年的WordPress插件。