将性能作为优先事项不仅对用户有益,对业务也有益。虽然此集合中的最佳实践主要侧重于优化 Google 发布商代码 (GPT) 集成,但许多其他因素也会影响给定网页的整体效果。每当您进行更改时,都务必要评估这些更改对您网站各个方面效果的影响。
衡量网页性能
为了了解更改对网站的效果有何影响,您首先需要确定一个基准来进行比较。为此,最佳方式是创建效果预算,以确定一个理想的基准(您的网站目前可能或可能不符合该基准)。不过,如果您希望保持固定的性能水平,则可以将您网站的当前性能指标用作基准。
如需开始衡量性能,建议结合使用以下方法:
- 合成监控
- 在实验室设置中,您可以使用 Lighthouse 和 Lighthouse 发布商广告评估服务等工具来衡量网页效果。这种衡量方式不需要最终用户互动,因此非常适合在自动化测试中使用,并且可用于在将更改发布给用户之前验证其效果。
- 实时用户监控 (RUM)
- 您可以使用 Google Analytics 和 PageSpeed Insights 等工具直接从用户那里收集真实的性能数据。此类衡量基于最终用户互动,因此有助于识别合成测试无法轻易发现的最后一公里性能问题。
请务必定期进行衡量并与基准进行比较。这样,您就可以很好地了解自己的网站效果是否在一段时间内朝着正确的方向发展。
选择要衡量的内容
在网站效果方面,没有单一指标可以告诉您网站的所有表现数据。您需要查看涵盖网页性能各个方面的各种指标,才能全面了解情况。下表列出了一些关键性能方面和建议的指标。
性能区域 | |
---|---|
感知的加载速度 |
措施
网页能够加载和呈现所有界面元素的速度。 建议的指标 |
网页加载响应能力 |
措施
网页在初始加载后响应速度有多快。 建议的指标 |
视觉稳定性 |
措施
界面元素的偏移量,以及这些偏移是否会干扰用户互动。如需了解详情,请参阅尽可能减少布局偏移。 建议的指标 |
除了网页效果之外,您可能还需要衡量广告专用业务指标。您可以从 Google Ad Manager 报告中获取每个广告位的展示次数、点击次数和可见度等信息。
测试更改
定义性能指标并开始定期衡量这些指标后,您就可以开始使用这些数据来评估网站所做更改对性能的影响。为此,您可以将进行更改后衡量的指标与进行更改前衡量的指标(和/或您之前建立的基准)进行比较。通过此类测试,您可以发现并解决性能问题,以免它们给您的企业或用户带来重大问题。
自动测试
您可以通过合成测试衡量不依赖于用户互动的指标。在开发过程中,应尽可能频繁地运行此类测试,以了解未发布的更改对性能有何影响。这种主动测试有助于在更改发布给用户之前发现性能问题。
实现此目的的一种方法是将合成测试纳入持续集成 (CI) 工作流中,这样,每当进行更改时,系统就会自动运行测试。您可以使用 Lighthouse CI 将合成性能测试集成到许多 CI 工作流中:
A/B 测试
在向用户实际发布更改之前,无法对依赖于用户互动的指标进行全面测试。如果您不确定更改的行为方式,这样做可能会有风险。降低此类风险的一种方法是进行 A/B 测试。
在 A/B 测试期间,系统会随机向用户提供网页的不同变体。您可以使用此方法针对总流量的一小部分提供网页的经过修改版本,同时继续向大多数提供未经修改的网页。然后,结合使用 RUM,您可以评估这两个组的相对效果,以确定哪个组的效果更好,而无需将 100% 的流量置于风险之中。
A/B 测试的另一个优势是,您可以更准确地衡量更改的影响。对于许多网站,很难确定效果出现细微差异是由于近期发生的变化还是正常的流量波动所致。由于 A/B 测试的实验组代表了总流量的固定百分比,因此指标与对照组之间的差异应该是一个常数。因此,我们可以更自信地将这两组之间观察到的差异归因于所测试的更改。
Optimizely和 Google 优化工具等工具可帮助您设置和运行 A/B 测试。不过,请注意,基于代码的 A/B 测试(这些工具的默认配置)本身可能会对性能产生负面影响,并提供误导性结果。因此,强烈建议您进行服务器端集成:
A/B 测试结果
若要使用 A/B 测试衡量更改的影响,您需要收集对照组和实验组的指标,并将其进行比较。为此,您需要一种方法来确定哪些流量属于哪个组。
对于网页性能指标,通常只需在每个网页上添加一个简单的标识符,指明是投放了对照组版本还是实验组版本即可。此标识符可以是您想要的任何内容,只要您能够解析该内容并将其与指标相关联即可。如果您使用的是预构建的测试框架,系统通常会自动为您处理。
对于广告专用业务指标,您可以使用 GPT 的键值对定位功能来区分实验组与对照组的广告请求:
// On control group (A) pages, set page-level targeting to:
googletag.pubads().setTargeting('your-test-id', 'a');
// On experimental group (B) pages, set page-level targeting to:
googletag.pubads().setTargeting('your-test-id', 'b');
然后,您便可在生成 Google Ad Manager 报告时引用这些键值对,以按组过滤结果。