提高 WordPress 速度和性能

已发表: 2024-08-30
显示性能分数的两台计算机的插图。

为客户创造最大价值的关键

您客户的网站是他们营销手段中的一个关键工具。赋予他们充分利用的能力。

当您意识到一个可以避免的错误导致客户网站上出现令人沮丧的错误体验时,这种感觉绝不是一种美妙的感觉。尽管这可能会让您感到不安,但想象一下他们的客户在想什么。

77%的消费者

说加载速度影响购买行为。

一项研究发现,至少 77%的消费者承认页面的加载速度会影响他们的购买前和购买后行为,无论是购买决定、回头客还是向朋友推荐某个品牌。

作为代理机构,您的客户依赖您提供可靠、稳定且灵活的网络体验,以满足数字市场快速变化的需求。提供这种程度的保证是您作为代理机构带来的价值的重要组成部分(即使不是最大的价值)。

值得庆幸的是,WordPress 的多功能性可以使这项工作变得相对简单,只需进行一些细微的调整、插件和其他免费工具即可。下面,我们将回顾一些任何机构都可以实施的以结果为导向的最佳实践,以确保他们从 WordPress 构建中获得最大收益。

目录
1.为客户实现价值最大化的关键
1.1.您客户的网站是他们营销手段中的一个关键工具。赋予他们充分利用的能力。
1.2. 77%的消费者
2. ABT:始终进行测试
3.插件:帮助还是伤害?
4.监控您的缓存设置
5.使用内容交付网络
6.优化你的静态资源
6.1.图片
6.2. CSS
6.3. JavaScript
7.保持简单:编写有效的主题逻辑
8.选择最适合该工作的主机
9.准备好开始了吗?
9.1.想要更多代理资源?注册我们的代理合作伙伴计划!

ABT:始终进行测试

两位开发人员正在讨论最近的性能基准。

管理加载时间可能需要大量的实验。这就是为什么制定初始基准始终是一个好主意,然后可以将其作为未来变化的比较点。

在对 WordPress 网站进行任何更改之前,基准测试是至关重要的一步。千万不要跳过它!

一组特别有用的基准测试指标是 Google 的 Core Web Vitals,这是三个关键指标,可深入了解影响用户体验的网站和页面性能方面,例如页面加载速度、交互性和视觉稳定性。努力改进这些元素不仅会提高客户网站的加载时间,还会提高其整体搜索排名。

三个核心 Web Vitals 指标是:

  • 最大内容绘制 (LCP): LCP 测量加载视口中可见的最大内容元素所需的时间,这通常是页面的主要内容,例如图像、视频或大文本块。 Google 建议力争得分低于 2.5 秒,2.5 到 4.0 秒表示还有改进的空间。任何超过 4.0 秒的时间都被视为“差”。
  • 与下一次绘制的交互 (INP): INP 跟踪网页对用户交互(例如单击、点击或按键)做出视觉响应所需的时间。理想情况下,此类反应的时间应少于 200 毫秒,任何超过 500 毫秒的反应都被视为“差”。
  • 累积布局偏移 (CLS): CLS 记录页面上元素意外移动的频率,这可能会让某些用户感到不舒服和沮丧。 Google 建议争取 0.1 或更低的分数。注意:CLS 是一种无单位度量,反映页面生命周期内所有不稳定元素的组合移动。

您可以使用 Google Search Console 等工具来衡量和跟踪这些基准,反映从现场实际用户体验中挖掘的数据。您不仅可以更深入地了解访问者如何与您的网站互动,而且可能会发现需要改进的领域。

如果您正在对网站进行故障排除,Google PageSpeed Insights 是另一个重要资源,它可以通过网站的模拟构建提供诊断反馈。PageSpeed Insights 不是仅仅依赖于现场数据,而是允许动态测试以进行优化,而无需进行任何更改在他们准备好之前就生活。

在记录了站点性能的当前状态之后,明显需要改进的地方可能会很明显。无论结果如何,这些数据都可以帮助您的代理机构在优化客户网站时做出明智的更改。

插件:帮助还是伤害?

插件是 WordPress 的突出元素之一,由充满活力的开源开发人员社区提供支持,致力于通过各种灵活的第三方工具增强平台。

也就是说,鉴于有大量的选择,管理员经常会发现自己陷入了“糖果店里的孩子”的心态。虽然很容易理解为什么用户可能希望使用尽可能多的插件,但这很快就会导致一系列问题。仅仅一个坏苹果就会导致明显的滞后时间。

这就是为什么在确定将哪些插件合并到构建中时,性能始终应该是主要关注点。添加新插件时,始终根据基准运行测试,并考虑任何现有插件是否可能将客户端的站点速度拖至次优或不可接受的水平。

当然,这并不是说您应该完全避免使用插件——远非如此。其中许多能够显着改善您的网站性能和用户体验。查询监视器(一种分析每个插件对加载时间的影响的重要工具)应该成为每个构建的基石。

同时,对您已经使用的插件产生的任何潜在的负面影响保持警惕,并在将来做出新的更改时采取相应的行动。

一位女性开发者在 WordPress 上更新插件。

如果插件拖累了网站性能,而您的客户没有它们就无法生存,请不要担心——我们并没有失去希望。请联系您的托管提供商讨论增加服务器内存或他们可能提供的其他 WordPress 优化包。

监控您的缓存设置

服务器端和客户端缓存都可以极大地缩短站点的加载时间,因此请确保充分利用它们的功能。

  • 客户端缓存:当用户第一次加载您的网站时,他们的浏览器会将您的静态资源下载到本地系统。用户现在将加载这些文件并准备好在任何后续访问中使用,从而获得更快的体验。
  • 服务器缓存:这种方法允许服务器加载并发送页面的预组装副本,而不是在用户每次登录时处理 PHP 脚本、查询数据库和组装站点。这可以减轻系统资源的压力,同时加快用户的加载时间。

由于这两种方法都可以为您的网站提供快速优势,因此密切关注可能改变服务器默认缓存设置的任何插件或第三方主题至关重要。当插件或主题禁用缓存时,情况并不总是显而易见,因此请与您的托管团队联系,以确定哪些缓存选项最适合您客户的网站。

如果您使用托管提供商,请考虑询问他们可能提供哪些类型的缓存优化。例如,WP Engine 通过 EverCache 为所有客户提供专有的前端缓存,以及在页面缓存中创建自定义页面变体的能力,允许用户动态查看独特的内容。

最后,在电子商务环境中,缓存可以在为购物者提供动态体验和保留缓存可以提供的性能优势之间实现巧妙的平衡。产品描述或价格等不太可能发生变化的资产可以缓存起来,以加快加载速度。然后,其他安全敏感或个性化资产(结帐页面、产品推荐)将从服务器加载(EverCache 非常适合解决此类问题)。

使用内容交付网络

CDN 工作原理的说明性指南。
简化的 CDN 图。

在线订购包裹时,您希望他们从 300 英里外(还是 3,000 英里)的仓库发货?

同样的问题也适用于您客户的数字资产及其全球受众。内容交付网络 (CDN) 是一种根据用户位置自动从不同位置交付网站资产的网络。例如,CDN 可以将巴塞罗那的访问者连接到伦敦或巴黎的数据中心,而不是旧金山。

一些最受欢迎的 CDN 包括 Amazon Web Services、CloudFlare 和 MaxCDN,其中大多数都提供免费版本的服务。在 WP Engine,我们提供与所有计划捆绑在一起的 CDN 服务,包括 Page Speed Boost 等工具,它可以显着利用您的内容分发网络的力量。

优化您的静态资产

巨大的照片、冗长的代码和其他笨重的资源可能会让您的网站性能变得一团糟。让我们看一下解决一些常见问题的最佳方法。

图片

虽然它们往往是任何页面上最大的文件,但大多数浏览器都会与其余资源异步加载图像。虽然这有助于提高网站的感知性能,但确保它们得到最佳压缩和最少使用仍然很重要。此外,从 JPEG 和 PNG 等传统图像格式转换为 WEBP 和 AVIF 等下一代格式可以显着缩短页面加载时间(甚至图像质量)。

虽然可以使用外部工具来执行此操作,但将程序直接安装到 CMS 中可以帮助您的团队避免常见的麻烦,同时尽可能保持这一关键流程的自动化。 WP Engine 的页面速度提升是一种很好的方法,不仅可以自动压缩图像,还可以自动压缩本节中提到的所有三个资产,并且还可以更新图像格式以符合当前的最佳实践。

CSS

如果您没有使用最新最好的方法,请不要失眠,但在编写或更新 CSS 代码时一定要建立标准并遵守它们。特别是,在使用这些文件之前始终对其进行压缩,包括删除任何可能会拖慢加载时间的未使用的扇区。

在设计站点时建立良好的开发工作流程可以使此过程变得简单,特别是如果您使用 Sass 等预处理器。

我们还推荐 PostCSS,一种用于转换 CSS 的 JavaScript 实用程序。三个有用的插件包括 postcss-cssnext、postcss-import 和 postcss-preset-env — 这些插件可以帮助您提供浏览器支持、连接文件并根据您的环境缩小 CSS。还有一个 postcss-sass 插件可以让你使用 Sass 语言。

不过,不要忘记检查您的样式 - Stylelint 是一个监控 CSS 质量的好工具,尤其是与 stylelint-sass 插件配合使用时。如果您觉得使用任务运行程序管理这些任务更容易,我们推荐 Gulp,您可以在其中选择 gulp-sass、gulp-postcss 和 gulp-stylelint 插件等。

JavaScript

理想情况:提供现代、精简的 JavaScript,支持网站必要的交互性,同时避免交付任何会降低用户速度的多余代码。

为了实现这一点,请考虑 JavaScript 文件的顺序。如果可能,请考虑在 <head> 中添加关键库和框架 JavaScript,位于可能依赖它们运行的​​任何文件之前。另一方面,非关键脚本可以放置在 <body> 的末尾,或者用“async”或“defer”属性标记。

Google Chrome 的 Lighthouse 还可以作为监控 JavaScript 性能的指南,识别调用过多文件、无效文件或拖慢渲染速度等问题。

请记住:第三方 WordPress 插件还可能会使用未缩小的阻塞 JavaScript 文件来使您的文档膨胀,因此请定期评估插件并使用 Lighthouse 查找任何损害您性能的文件。

我们同样的两个开发人员讨论主题逻辑。

保持简单:编写有效的主题逻辑

如果您保持主题逻辑简单且“切中要点”,那么您应该会看到后端性能显着提高。过多的逻辑循环(if、else 等)会消耗大量内存,并且会减慢页面的速度,导致爬行速度不令人满意。我们发现 Transients API 是一种有助于最小化这些影响的有用工具。 WordPress 瞬态存储临时缓存的数据,这意味着您的逻辑只需运行一次(即第一次访问时),然后将结果存储在数据库中以供将来使用。

选择最适合该工作的主机

最后:您的托管套餐是否符合客户对速度的需求?

虽然商品托管计划看起来像是一个预先讨价还价的方案,但这种方法通常会带来隐藏的缺点:即,可能会出现性能缓慢、不规律、停机时间增加的风险,或者花费太多时间管理服务器或托管帐户以避免这些问题的风险。更不用说一路上所有相关的机会成本。

通过选择 WP Engine 等托管 WordPress 托管平台,即使是流量最高的网站,用户也可以获得最佳性能。为 WordPress 定制的服务器包括以下功能:

  • 强大的缓存,
  • 内容交付网络,
  • 一键登台,
  • 免费的自动迁移,
  • 专家客户支持
  • 和其他内置功能专注于优化您的构建性能

事实上,托管 WordPress 托管可以显着提高您的速度和可靠性高达50%

准备好开始了吗?

如果您是一家代理机构,需要处理数十个(甚至数百个)不同的客户网站,您可能知道在第一次尝试时就正确进行这些优化是多么重要。并在规模上做到正确?并不总是那么容易。

这就是为什么与 WP Engine 这样的托管平台合作不仅可以显着提高客户站点的性能,还可以让您的团队专注于他们最擅长的事情:取悦您的客户,而不是关注网络缓存的细节。

我们还为我们的代理合作伙伴提供广泛的福利,包括为需要更具体帮助或解决方案的会员提供专门的合作伙伴成功经理。如果您想改善客户的网络体验,同时简化后端工作负载,我们随时为您提供帮助。

有兴趣了解更多吗?直接与专门的代理专家聊天即可开始。

WP Engine 代理合作伙伴徽章。
想要更多代理资源吗?
注册我们的代理合作伙伴计划!