跳到主要内容

在本文中,我将向您幕后介绍如何使WordPress比静态站点生成器和无头CMS平台更快。

注意:本文比我们通常在WPBeginner上发布的内容更具技术性。对于非技术用户,我建议遵循有关如何加快WordPress的最终指南。

更新:我们不再使用本文共享的设置。相反,我们已经完全切换到SiteGround管理的Google Cloud平台。我们拥有相同的速度结果,并获得了更快的后端性能。阅读为什么我们切换到SiteGround的原因。

背景

最近,WordPress从“现代”开发人员那里得到了很多不好的代表,他们说WordPress很慢。

该语句通常跟进,你应该切换到JAMstack静态站点生成像GatsbyJS。企业界的其他人会说,您应该切换到像Contentful这样的无头CMS 。

我几个非常成功的企业家朋友开始问我这是否是真的。

我们如何使wordpress比静态站点生成器更快
我们如何使wordpress比静态站点生成器更快

有些人甚至开始了迁移到无头CMS的过程,因为他们阅读了一些案例研究,这些案例研究了其他人如何通过从WordPress切换到静态网站生成器来释放巨大的速度改进。

这让我感到非常沮丧,因为我知道他们在浪费数万美元的迁移成本。更不用说,无限的定制成本将在未来累积。

因此,我将其作为挑战来证明像WPBeginner这样的大型WordPress内容网站可以加载的速度与大多数现代静态网站生成器一样快,甚至还不及它。

您可以称我为老学校,但归根结底,静态站点只是从缓存加载的页面。

结果

在我跳到确切的WordPress托管基础架构,服务器配置和插件之前,我认为分享结果很有帮助。

以下是WPBeginner主页从其华盛顿特区服务器在Pingdom上加载的速度:

根据一天中的时间和您检查的位置,此结果的范围从400毫秒到700毫秒不等,这对于主页来说是非常快的。

这是我针对单个帖子页面进行的测试,因为它具有更大的图像和更多的内容:

在桌面版Google页面速​​度测试中,我们还获得了“ 100”的完美评分。尽管我们在移动得分方面确实有待改进。

上面的结果是针对缓存页面的,这是我们的读者和搜索引擎机器人在访问我们的网站时所获得的。WPBeginner的感知加载时间几乎是即时的(稍后会详细介绍)。

为了进行比较,下面是Gatsby主页的速度测试结果。这是一个流行的静态站点生成器,许多开发人员都对此赞不绝口:

这是Netlify主页的速度测试结果,Netlify主页是许多开发人员推荐的流行的静态站点主机。请注意,他们的请求量只有一半,其页面大小是WPBeginner的30%,但加载速度仍然比我们的主页慢。

Contentful无头CMS的主页速度(即“企业如何提供更好的数字体验”)根本没有被优化。这是我们测试过的最慢的网站。

我分享这些统计数据并不是要抹黑其他框架,而是要给出观点,即并非所有新事物都像看起来那样闪亮。

具有适当托管基础结构和优化功能的WordPress可以与任何静态站点生成器一样快。此外,没有其他平台可以与WordPress通过其庞大的插件和主题生态系统为企业主提供的灵活性相提并论。

WPBeginner托管基础架构

关于网站速度,没有什么比您的网络托管基础设施更重要。

众所周知,我自2007年以来一直是HostGator的客户。我于2009年在一个小型HostGator 共享托管帐户上创建了WPBeginner博客。

随着我们网站的发展,我们升级到了他们的VPS托管,然后升级到专用服务器。

在过去的十年中,我有机会与他们的许多团队成员紧密合作,他们已经成为WPBeginner家族的一员。

因此,当我面临使WPBeginner比静态站点生成器更快的挑战时,我求助于他们。

我与他们的领导团队分享了我的愿景,他们提供了帮助我为WPBeginner建立一种企业托管设置的工具。

他们让Bluehost和HostGator团队中最好的工程师与我紧密合作,以使WPBeginner迅速发展。

以下是WPBeginner托管设置的概述:

如您所见,这是一个跨两个地区(德克萨斯州和犹他州)的多服务器设置。总共有9台服务器(不包括负载均衡器云)。每个服务器都是具有8个内核(16个线程),32GB RAM和2 x 1TB SSD(RAID设置)的Xeon-D CPU。

我们正在使用Google的Cloud Load Balancing平台,因此我们可以在全球范围内实现无缝的自动扩展和负载平衡。

一旦设置好硬件并进行适当的数据同步,Bluehost和HostGator团队就会共同努力优化WordPress的服务器配置。我希望这些优化中的一些将很快融入未来的WordPress托管计划中

服务器配置摘要

仅用几段时间来总结此复杂设置的服务器配置非常困难,但是我会尽力而为。

我们将Apache用于我们的Web服务器软件,因为该团队对它更加熟悉。我不会参加NGINX与Apache的辩论。

我们将PHP 7.2与PHP-FPM池一起使用,因此我们可以处理大量的流程和请求。如果您的托管公司未使用PHP 7+,那么您将错过认真的速度优化。

我们将操作码缓存与高级缓存预热器配合使用,以确保没有真正的用户会遇到未缓存的综合浏览量。

我们还将对象缓存与内存缓存一起使用,因此我们可以在WordPress管理区域中为登录用户(我们的作者)改善未缓存页面命中的响应时间以及其他API响应时间。这是WordPress管理员中“所有帖子”屏幕的网络负载标签:

透视一下,我们的管理区域体验现在比以前快了2倍。

对于我们的数据库服务器,我们从MySQL切换到了MariaDB,该数据库是MySQL的克隆版本,但速度更快,更好。我们还从HyperDB切换到LudicrousDB,因为它可以帮助我们改善数据库复制,故障转移和负载平衡。

还有许多其他配置可帮助我们提高性能和可伸缩性,例如HTTP / 2和HSTS,可实现更快的连接+加密,以及在数据中心中断的情况下在新区域中启动其他服务器的功能,等等。

我觉得我并没有对团队建立的出色设置感到公平,但是请知道我的核心优势是营销。是的,我是一位写有关WordPress的博客作者,但是这里的许多技术优化都远远超出了我的薪资等级。

这些工作由Endurance团队中的超级聪明的工程师完成,包括David Collins(Endurance首席架构师/ HostGator的CTO),Mike Hansen(WordPress核心开发人员),以及我在以下积分部分中要感谢的其他人。

CDN,WAF和DNS

除了网络托管外,DNS提供商,内容交付网络(又名CDN)和Web应用程序防火墙(WAF)是影响网站速度的其他重要因素。

虽然我将其列为三部分,但许多公司现在都以捆绑计划提供这些解决方案,例如Sucuri,Cloudflare,MaxCDN(StackPath)等。

由于我想拥有最大的控制权并分散风险,因此我正在使用三个独立的公司来高效地处理每个零件。

WPBeginner DNS由DNS Made Easy(与Constellix相同的公司)提供支持。他们一直被评为全球最快的DNS提供商。DNS Made Easy的优点是,当CDN或WAF上的特定数据中心无法正常工作以确保最大的正常运行时间时,我可以进行全局流量定向。

我们的CDN由MaxCDN(StackPath)驱动。它们基本上使我们能够从遍布全球的大型服务器网络中为我们的静态资产(图像,CSS文件和JavaScript)提供服务。

我们正在使用Sucuri作为我们的Web应用程序防火墙。除了阻止攻击之外,它们还充当CDN的另一层,其总体性能令人惊叹。我相信他们拥有市场上最好的WordPress防火墙解决方案。

在进行网站速度优化时,减少每毫秒的时间很重要。这就是为什么将这些解决方案提供商与我们新的虚拟主机基础架构结合使用会产生巨大差异的原因。

为了说明这一点,下面是WPBeginner.com与GatsbyJS.org与CloudFlare.com的瀑布细分:

请注意,与其他热门网站相比,WPBeginner的DNS时间,SSL时间,连接时间和等待时间都是一流的。这些改进中的每一项都会带来最佳效果。

Instant.page,优化图像和其他最佳实践

您可能已经注意到的一件事是浏览WPBeginner帖子和页面时接近即时的加载时间。

除了我上面提到的所有内容之外,我们还使用名为即时的脚本欺骗了延迟,该脚本使用即时预加载。

基本上,在用户单击链接之前,他们必须将鼠标悬停在该链接上。当用户悬停了65毫秒(很短的时间)后,实际上就有两分之一会点击该链接。

Instant.page脚本此时开始预加载该页面,因此,当用户实际单击链接时,已经完成了许多繁重的工作。这使人的大脑几乎感觉到网站的加载时间。

要在您的网站上启用Instant.page,您只需安装并激活Instant Page WordPress插件即可。

这个脚本非常简洁。我强烈建议您查看他们的网站,然后单击“测试您的点击速度”按钮,看看它如何欺骗大脑。

更新:我暂时禁用了Instant.page,并且我将在不久的将来测试FlyingPages插件。Gijo Varghese在WPBeginner Engage Facebook组中与我分享了他的新插件,它似乎融合了Instant.page和quicklink脚本的优点。

优化网络图像

尽管正在开发新的图像格式,例如webp,但我们尚未使用它们。相反,我们要求所有作者使用TinyPNG工具优化每个图像。

您还可以使用Optimole或EWWW Image Optimizer之类的插件自动执行图像压缩。

但是,我个人更希望团队手动执行此操作,因此我们不会在服务器上上传大文件。

目前,我们不对图像进行任何延迟加载,但是由于Google已内置Chrome 76的延迟加载支持,因此我打算在不久的将来添加它。

WordPress核心中还有一张票可以在所有站点上添加此功能(真的希望很快就会发生这种情况),因此我不必编写自定义插件。

更新:在我发布博客文章几小时后,Google发布了适用于WordPress的Native Lazy Load插件。

限制HTTP查询+最佳做法

根据您使用的WordPress插件,某些插件会在每次加载页面时添加其他CSS和JavaScript文件。如果您的网站上有很多插件,那么这些其他HTTP请求可能会失控。

有关更多详细信息,请参阅WordPress插件如何影响您的网站加载时间。

现在,在您得出错误的结论:太多的WordPress插件不好时,我想让您知道WPBeginner网站上正在运行62个活动的插件。

您需要做的是结合CSS和JavaScript文件,以减少HTTP请求。一些WordPress缓存插件(例如WP Rocket)可以通过其缩小功能自动执行此操作。

您还可以按照本文中的说明手动进行操作,这是我们WPBeginner团队所做的。

除了插件和主题添加的HTTP请求之外,您还需要注意在网站上添加的其他第三方脚本,因为每个脚本都会影响您的网站速度。

例如,如果您正在运行大量广告脚本或重定向脚本,那么它们将使您的网站变慢。您可能希望使用Google跟踪代码管理器之类的工具来仅在需要脚本时有条件地加载脚本。

如果您是TechCrunch或TheNextWeb之类的受广告支持的网站,那么您将无能为力,因为删除广告是不可行的。

幸运的是,WPBeginner并不依靠第三方广告脚本来赚钱。想看看WPBeginner如何赚钱吗?请参阅我关于WPBeginner收入的博客文章。

经验教训(到目前为止)+我的最终想法

这是一个全新的托管基础​​架构,我敢肯定,我将加班学习很多课程。

到目前为止,我喜欢速度改进,因为它帮助我们提高了SEO排名,并且我们的管理区域快得多。

通过新的多服务器设置,我们引入了新的部署工作流程,以使WPBeginner与其他Awesome Motive产品站点保持一致。

这意味着我们现在已经内置了适当的版本控制功能,并且采取了一些措施来阻止我鲁((例如,未经适当测试就添加插件,未经测试就从仪表板更新插件等)。

这些更改为我提供了最终退出开发并将WPBeginner网站的统治权移交给我们的开发团队的途径。

我已经抵制了很多年,但是我认为时机已到,我只需要接受它。

新的设置没有cPanel或WHM,所以这使我几乎毫无用处,因为我不再非常熟练使用命令行。

到目前为止,我们已经吸取了两大教训:

首先,由于服务器同步/复制,更新WordPress并不那么直接。当我们将我的个人博客(SyedBalkhi.com)升级到WordPress 5.2时,更新文件无法在其中一个Web节点上正确同步,并且调试花费了比预期更长的时间。我们正在为此构建更好的构建/测试过程。

其次,我们需要在团队之间进行更好的沟通,因为我们在负载均衡器配置错误方面遇到了小麻烦,这导致了一些停机时间。更糟糕的是,我在土耳其航空的一次跨大西洋飞行中,WiFi无法正常工作。

幸运的是,由于托管团队的快速响应,所有事情都得到了整理,但这帮助我们创建了几个新的标准操作程序(SOP),以便将来更好地处理此事件。

总的来说,我对设置非常满意,并且我知道为WPBeginner进行的某些缓存配置/优化将成为HostGator Cloud和Bluehost WordPress托管计划的标准部分。

我认为这毋庸置疑,如果您只是开始建立网站,博客或在线商店,则不需要这种复杂的企业设置。

我总是建议您像我一样从HostGator共享计划或Bluehost共享计划开始,然后随着业务的增长升级您的托管基础​​架构。

您可以在上面的当前WordPress托管计划中应用我上面分享的许多优化。

例如,Bluehost标准计划已经附带了一个可以使用的内置缓存插件,并且默认情况下它们还提供PHP 7。

您可以将其与Sucuri等CDN + WAF结合使用,以大大加快您的网站速度。

现在,如果您是一家中端市场/企业公司,想要类似的托管设置,请通过我们的联系表与我联系。我可以帮助您指出正确的方向。

特别感谢+积分

尽管在上面的文章中,我对HostGator和Bluehost品牌大喊大叫,但我想花一点时间来认识和赞赏为实现这一目标而在幕后工作的个人。

首先,我想对耐力领导团队Suhaib,Mitch,John Orlando,Mike Lillie和Brady Nord表示感谢,他们同意帮助我应对挑战。

我还要感谢Mike Hansen,David Collins,Rick Radinger,Chris Miles,David Ryan,Jesse Cook,David Foster,Micah Wood,William Earnhardt,Robin Mendieta,Rod Johnson,Alfred Najem以及数据中心团队中的其他人努力工作并实现这一目标。

我想特别向Steven Job(DNSMadeEasy的创始人)大喊大叫,以快速回答我的问题并帮助我更好地理解某些设置。还想向Sucuri的 Tony Perez和Daniel Cid 致以永远支持我的声音。

最后但并非最不重要的一点,我想特别感谢克里斯·克里斯托夫(Chris Christoff)。他是MonsterInsights的共同创始人,他很乐于帮助我进行许多测试和部署。

我真的希望您发现有关WPBeginner托管基础架构的幕后案例研究对您有所帮助。您可能还想看看我们有关如何加快WordPress速度的终极指南,这对初学者更加友好。

回到顶部