WordPress 性能清单

我们一次又一次地看到WordPress用户在性能上挣扎。在很多情况下，实现更快的速度并不难。大部分归结为选择正确的技术堆栈并遵循最佳优化实践。在表演行业工作了多年，我们看到了什么有效和不有效。

谷歌使用他们所说的Core Web Vitals。您网站的移动版本根据最大内容绘画（LCP）、与下一个绘画的交互（INP）和累积布局转移（CLS）等因素的组合获得分数。簡單地說，雖然程式量和總載入時間對性能始終很重要，但您現在還必須考慮您的網站如何載入程式。

以下是我们为节省您的时间而整理的绩效清单！提到的所有工具和服务都是我们100%支持并在网站上使用的工具和服务。如果您有问题，我们很乐意回答，无论它是否与我们的插件有关。我们相信，更快的网站等于对每个人来说都有更好的网络。

投资托管WordPress托管#

没有什么比您选择的WordPress主机为您的网站提供动力更重要的了。把这想象成汽车的引擎。你想要一辆科尔维特还是普锐斯？我们总是建议投资托管WordPress托管。这些类型的主机对环境进行了明确的微调，以加快WordPress的速度。

缓存是关键#

如果没有适当的缓存解决方案，您永远不会达到您想要的分数。当用户首次访问您的网站时，缓存会构建并存储在您的服务器上。您网站的所有后续点击量都以闪电般的速度从缓存中传递给用户。

是否见过谷歌发出的“减少初始服务器响应时间”或“使用高效的缓存策略为静态资产提供服务”的警告？这就是缓存修复的。有两种方法可以实现它，在服务器级别或使用WordPress插件。

像Kinsta这样的托管服务提供商有服务器级缓存。这方面的一个好处是，您永远不必为缓存插件而烦恼。否则，我们建议使用WP Fastest Cache、Super Page Cache或Cache Enabler等免费插件。像WP Rocket这样的高级插件也运行良好。

另一个提示是增加你的缓存到期时间。与其每24小时一次，不如尝试将其延长到更长的持续时间，比如7天或30天。这增加了您的HIT缓存率，这意味着更多的用户将从缓存中获取您的网站。

您可能还想考虑预加载或预热缓存。在缓存过期或内容更新后，这可能会有所帮助。像Warmer这样的独立插件很出色。

使用Brotli或Zstandard等较新的压缩形式也有助于进一步缩小资源大小，而不丢失任何数据。

快速的WordPress主题至关重要#

无论是高流量博客、WooCommerce商店还是谷歌AdSense网站，GeneratePress主题始终是我们的首要推荐。它快速、轻便，将确保您的网站始终看起来漂亮。我们在所有的WordPress网站上都使用这个，包括这个网站。

GeneratePress最好的地方是开发人员。Tom Usborne和他的团队和我们一样真正关心绩效！以下是我们喜欢的GeneratePress的一些关键功能：

将GeneratePress与GenerateBlocks插件配对，您将拥有一个强大的网站设计解决方案，该解决方案对Google Core Web Vitals具有性能友好和未来。整个网站都是使用块构建的，没有任何额外的代码。

你想使用GeneratePress和GenerateBlocks，但没有时间自己动手吗？我们建议联系我们在WP Boosters的朋友。他们可以将您的现有网站和设计转换为GeneratePress + GenerateBlocks。

使用内容交付网络#

内容交付网络（CDN）通过将您的资产和代码（HTML、JS、CSS、图像）存储在全球不同的边缘服务器（POP）上，帮助加快您的WordPress网站速度。当用户访问您的网站时，它从物理上最近的边缘服务器上的缓存中传递。我们看到CDN的速度提高了68%！

我们推荐两种不同的方法：

1. 带有自动平台优化（APO）的Cloudflare。Cloudflare位于您的网站和互联网之间，并从其边缘服务器提供全页缓存。它导致TTFB和服务器响应时间低。这种方法缓存HTML、JS、CSS和图像。Kinsta实际上为所有客户免费提供此（边缘缓存）。
2. 传统的CDN，如KeyCDN。将此视为您网站的附加组件，通常使用像cdn.domain.com这样的子域。Perfmatters CDN重写功能使将传统的CDN连接到您的WordPress网站变得快速而简单。这种方法缓存JS、CSS和图像。

图像优化（压缩、WebP、惰性加载）#

在移动设备上，图像平均占整个网站页面权重的48%。这就是为什么图像优化是你不能忽视的。

首先，您需要压缩图像以减少其文件大小。我们建议使用ShortPixel或Imagify插件。它们的自动有损压缩确保了质量和尺寸之间的完美平衡。最好将图像保持在100 KB以下，特别是对于移动设备。如果您需要手动微调图像，谷歌的免费Squoosh工具效果很好。或者用于优化SVG（图标和徽标）的SVG查看器。

其次，您应该将图像转换为WebP或AVIF格式，现在所有现代浏览器都支持这些格式。在我们的测试中，.webp文件平均比PNG或JPG文件小59%，.avif可以再减少约29%。这将解决来自谷歌的“以下一代格式提供图像”警告。同样，ShortPixel或Imagify可以自动为您完成此操作。

第四，您可以通过自动向图像添加缺失的宽度和高度属性来减少累积布局偏移（CLS）。最后，您可以自动预加载关键图像或利用获取优先级来帮助减少最大内容绘制（LCP）。

查看我们的深入文档，了解您可以在WordPress网站上优化图像的所有不同方式。

数据库和磁盘空间#

随着时间的推移，修订、垃圾邮件评论、瞬态、自动草稿甚至垃圾等内容开始增加，浪费数据库中的空间。有一个表格，wp_options，如果您的网站太大，它可以使它爬取。我们看过它的次数数不清。

就像你更换汽车机油一样，你也应该定期优化你的数据库。我們的Perfmatters外掛使用以下選項使此快速而簡單：

• 删除修订（帖子、页面和自定义帖子类型）。
• 一扫而就删除WordPress垃圾邮件。
• 清理评论和帖子中的垃圾。
• 删除编辑内容时保存的旧自动草稿。
• 删除过期的瞬态，并保持wp_options整洁。
• 优化您的数据库表，以回收未使用的空间。

如果您愿意，您甚至可以每天、每周或每月自动进行优化。清理完数据库后，为未来设定限制很重要。例如，禁用或限制帖子修订。这有助于确保数据库健康。

我们还建议您从媒体库中删除旧的和未使用的图像。如果您的网站已经存在了一段时间，那么您很可能有很多网站。免费的媒体清洁器插件做得很好！

删除插件时，进行彻底卸载也很重要（请参阅开发人员的文档）。否则，它可能会在你的数据库中留下不需要的垃圾。如果需要，您可以手动清理数据库表。免费的AAA选项优化器插件也是清理自动加载选项的好方法。

少用网络字体#

网页字体平均占网页在移动设备上整体权重的6%。它们会影响您的加载时间和页面渲染方式。许多网站使用的字体比它们需要的要多。选择几种不同的重量变化，正常、粗体等。这将保持尺寸小。此外，超过97%的浏览器（源代码）支持WOFF 2。

始终在自己的服务器或CDN上托管网络字体。每个现代浏览器都已转向HTTP缓存分区。这意味着每个网站的字体都会被重新下载，无论字体缓存在用户的浏览器中。因此，利用更少的DNS请求和服务器的缓存头。

对于谷歌字体，我们建议使用我们本地的谷歌字体功能。您可以自动为字体显示添加swap，并在本地托管您的字体。如果您要手动添加它们，请用Perfmatters预加载您的字体。这些优化将解决谷歌的“在网络字体加载期间所有文本仍然可见”的警告。

GitHub、Medium、Ghost等知名品牌，甚至您的WordPress管理儀表板都使用「系統字型」。这意味着他们利用了您电脑上的字体。几年前，这看起来不太好。但随着当今较新的操作系统，它们都预装了更漂亮的字体。

使用系统字体时，根本不需要加载任何字体。那很大！它消除了任何FOUT（无样式文本的闪光）或FOIT（隐形文本的闪光）的丑陋。最好的部分是，您永远不必担心谷歌的渲染阻止警告，因为没有警告。

你知道这个网站使用系统字体堆栈吗？你可能甚至没有注意到。没错；这个网站没有加载一个字体。查看本教程，了解如何在WordPress中移动到系统字体堆栈。如果您使用的是像GeneratePress这样的推荐主题，这只需单击一下。

仅使用您需要的字体图标#

Font Awesome令人难以置信，数百万网站使用它来显示您每天在网络上看到的图标。然而，插件和主题的一个常见且有缺陷的实现是，它们在整个网站上加载了整个字体图标库。

CSS和JS优化#

不幸的是，许多WordPress插件和主题的开发并没有考虑到性能。他们只是尽可能多地添加功能来增加他们的底线。因此，许多加载脚本（CSS和JS）遍布整个网站，而没有制定如何以不同的方式进行策略。

只有当脚本实际在页面上使用时，插件才应将其列入队列。（来源：谷歌）

本地托管谷歌分析

具有讽刺意味的是，谷歌分析有自己的一系列性能问题。它生成额外的第三方请求，并使用短的缓存到期时间。您可以通过使用Perfmatters在本地托管您的谷歌分析脚本来解决这个问题。

我们有几个不同的实现供您选择，如最小分析、谷歌分析4或我们与MonsterInsights的整合。

缩小JavaScript和CSS

您可以在Perfmatters中自动缩小JavaScript和CSS。这是从代码中删除不必要的字符（空格、注释、缩短函数和变量名称等）的过程，以及额外的标记清理。它减少了文件的整体大小，并加快了加载时间。

移除未使用的 CSS

当您有不需要或页面上使用的插件或主题加载的代码时，PageSpeed Insights会触发减少未使用的CSS警告。开发人员通常仅在使用样式表时为样式表列队列。然而，很多时候，可能不需要的额外样式也会被添加。这导致大量未使用的CSS，这会减慢您的WordPress网站。它还可以触发渲染阻止警告。您可以在Perfmatters中自动删除未使用的CSS。

仅在需要的地方加载自定义CSS/JS

您需要为网站或帖子类型的特定部分添加自定义代码吗？这就是我们在Perfmatters的代码片段管理器来救援的地方。添加您的自定义CSS或JS，并选择您想要加载的位置。这是加载自定义代码的最佳方法，并防止谷歌发出“未使用的CSS/JS”警告。

推测性加载#

投机加载是一种令人难以置信的浏览器级优化，它动态地预渲染或预取用户接下来可能需要的URL。这导致几乎瞬时的加载时间，并显著降低LCP、INP和TTFB（真实用户数据）。它改善了用户体验和感知性能（网站感觉有多快），当过于关注分数时，这往往被忽视。

从WordPress 6.8开始，投机加载已添加到核心中，并且已经在幕后在您的网站上运行。然而，它默认为较慢的模式（预取）和渴望设置（保守）。我们让您在Perfmatters中访问更强大的模式（预渲染）和渴望设置（中度、渴望），因此您可以充分利用投机加载。

推荐的插件、提示和工具#

不幸的是，WordPress存储库上有超过60,000个插件和更多高级插件，外面有很多不好的插件。许多人根本不关心表现。您使用的插件数量不如它们的编码程度重要。

好消息是，确实有开发人员关心性能。以下是我们强烈推荐的几个插件：

• GenerateBlocks：抛弃繁重的页面构建器，利用块！我们的整个网站都是用积木建造的。
• 反垃圾邮件蜂：轻量级的垃圾邮件保护。符合GDPR。
• Fluent Forms：轻巧而强大的联系表单构建器。如果您需要一些超级简单的东西，基本表格或Jordy的联系表格块也很好用。
• SEO框架：针对速度优化的轻量级SEO插件，没有广告或不必要的功能。
• Wordfence登录安全：用于双因素身份验证的剥离和免费插件。
• Novashare：我们自己的社交共享插件从头开始开发，并考虑到性能。简单的用户界面，共享计数，没有臃肿。
• 画廊和图像块的灯箱：如果您不能没有它，这个插件利用原生WordPress块，只有3.7 KB的JS，并且没有jQuery依赖性。

性能提示#

每天与客户合作，我们看到了一切。以下是一些提示和建议，可让您快速前往谷歌会喜欢的WordPress网站：

• 在页面完全加载之前，利用早期提示来获取资源。
• 延迟加载元素有助于优化DOM并减少总阻塞时间（TBT）。
• 不惜一切代价避免重定向。如果您需要添加重定向，请在服务器级别进行。像Kinsta这样的托管提供商使用MyKinsta中的重定向工具使这变得简单。
• 抛弃滑块，改用静态标题，以避免布局偏移（CLS）和额外的膨胀。
• 如果没有需要，请不要使用动画，尤其是像Elementor这样的页面构建器。这些增加了CPU、JS和渲染时间。它加起来真的很快。例如，我们看到Lottie或GSAP的动画在折叠上方将移动分数降低15分以上。使用静态元素总是性能的最佳效果。
• 如果您在滑块中使用视频，最好直接上传它们，并从CDN中提供它们。查看这些视频优化技巧。
• 不要使用谷歌AMP。專注於使您的響應式網站更快，不要把自己鎖定在控制力較差的生態系統中。截至2021年，谷歌不再对使用它的人给予优惠待遇（来源），AMP符号不再显示在SERP中。了解如何安全地禁用AMP。
• 谷歌reCAPTCHA是性能杀手。最好使用蜜罐解决方案或Cloudflare Turnstile。查看这些很棒的免费reCAPTCHA替代品。
• 许多cookie/隐私插件都膨胀了，并加载了大量的JS和CSS。查看一些更好的轻量饼干解决方案。
• 如果您正在使用Cloudflare，请关闭Rocket Loader和电子邮件地址混淆。
• 在WooCommerce网站上，关闭使用跟踪以删除stats.wp.com请求。
• 从您的CDN加载您的Gravatars，然后懒惰地加载它们。
• 不要到处加载谷歌地图。您可以使用我們的Perfmatters外掛在不應該載入的谷歌地圖中停用它。或者发挥创意，改用图像。
• 不要从您自己的CDN以外的CDN加载jQuery等库。由于浏览器隐私和HTTP缓存分区，不再有其益处。

工具#

以下是我们在日常工作流程中使用的一些第三方工具，在故障排除和提高WordPress性能时非常有用。

• DebugBear：找到LCP元素、预加载和获取的内容、可能是调试CLS（屏幕截图和节流视频）的最佳工具的好方法。
• GTmetrix：用于总页面大小和页面请求的优秀瀑布分析和图表。例如，查看占總頁面大小的影象或JS的百分比。首先将您的优化工作集中在最大的尺寸上。
• 黄色实验室工具：查看您的字体库（Font Awesome）实际使用了多少，如果您正在加载多个jQuery版本等。
• HTML大小分析器：快速发现您最大的内联代码块，并查看它们为您的总HTML页面大小增加了多少。简单地把所有东西都放在内衬里对FCP和LCP不利。
• 速度生命体征和性能测试：一次从不同位置测量您的TTFB。衡量Cloudflare边缘缓存的积极影响的好方法。

转换网站或获得绩效审计#

如果您已经按照我们的清单联系了我们的支持，但仍然对自己的速度不满意，以下是我们推荐的。

将您的网站转换为GeneratePress + GenerateBlocks#

首先，如果您使用的是臃肿的主题或页面构建器，我们总是建议移动到像GeneratePress这样的轻量级主题（以及GenerateBlocks）。他们的代码库超级轻量级，从头开始开发，考虑到性能。有时你必须修复网站的底层，然后其他一切都会到位。如果您没有时间自己做这件事，我们建议您联系我们在WP Boosters或OGAL Web Design的朋友。他们可以将您的现有网站和设计转换为GeneratePress + GenerateBlocks。