这家时尚电子商务零售商如何将核心网页指标和性能指标与业务指标相关联，使 KPI 有所增加，并构建了“效果业务用例计算器”来推动产品决策和绩效文化。
在许多公司里，网站速度性能和核心网页指标仍然主要是工程团队的职责。如果企业不了解业务和客户体验的价值，网站速度可能对其他业务领域不可见。这可能会导致在制定关键决策和制定路线图时忽略绩效。
为了改善各个团队的表现文化，并显著提升其网络体验，奢侈品电子商务时尚零售商 Farfetch 启动了一个项目，旨在定义和使用真正以客户为中心的效果指标。他们希望将这些指标与业务指标关联起来，从而揭示绩效对公司 KPI 的影响。
不过，他们的雄心壮志并未就此结束。最终，该项目的目标是大规模改变文化——打破组织内部的孤岛，引入一种以业务为导向的新语言，让每个人都能共同讨论以前的技术话题。Farfetch 团队希望让网站速度提升是我们共同的责任，有助于促进明智的决策，并将其确立为打造良好网络体验的主要支柱。
Farfetch 一开始就意识到，单靠一个部门无法像之前那样做到这一点，因此组建了一支由来自公司各个领域（工程、基础架构、架构和产品）的专家组成的核心团队，通过逐步实施策略来改进公司对此主题的看法。
第 1 步：定义、衡量和监控指标
首先，Farfetch 需要部署合适的监控工具，以便了解整个历程中各个接触点和应用中的当前状态和偏差。
他们使用实验室数据和真实用户监控（现场数据）来跟踪核心网页指标，并使用其他以用户为中心的性能指标来分析当前的速度性能状态。他们使用 JavaScript 和 web-vitals.js 库捕获数据，使产品分析团队能够在同一会话中查看效果指标和业务指标，从而开始研究两者之间的相互影响。
这个跨学科团队开始着手了解哪些指标对公司最重要的指标。为此，他们研究了 Farfetch 用户的关键历程路径，并尝试将该历程与效果标记关联起来。除了 Google 概述的核心网页指标（每个指标都代表用户体验的一个不同方面）之外，他们还使用自定义 JavaScript 来跟踪首字节时间 (TTFB)、首次内容绘制 (FCP)、首次绘制和可交互时间 (TTI)。
这些指标是使用 Performance API、Long Tasks API 和 Google 的 polyfill 的多种方法收集的。如需了解详情，请参阅 Web 高级首席工程师 Manuel Garcia 撰写的 2020 年年中 Farfetch Tech 博文。
在数据分析方面，Farfetch 拥有自己的多渠道跟踪解决方案，前端应用名为 Omnitracking。它可跟踪网页浏览、用户操作和系统操作生成的事件。Omnitracking 数据模型是 Farfetch 提供的分析、数据探索和报表用例解决方案，基于跟踪器生成的事件。该数据模型的目标是为需要了解以下内容的任何人提供帮助和支持：
- 用户行为
- Farfetch 应用的用户体验
- 应用使用情况
- 关键转化和次要转化
- 跨渠道和漏斗分析
然后，我们的想法是将由 JavaScript 捕获的 Faffetch.com 上每次网页浏览的性能数据添加到此数据层中。遵循此模型可以保证每个会话的效果数据与主要转化漏斗指标保持一致，并以此为基础对相应主题进行分析探索。
最后，Farfetch 针对各个主要历程页面中的每个指标制定了基于时间的性能预算，并制定了用于处理预算违规的治理流程。他们还开始整合 CI 流水线的性能指标，以尽快了解开发流程中的预算偏差。
第 2 步：通过商务语言进行交流
由于 Farfetch 的内部商业智能数据集中现在可以提供效果数据，分析团队开始探索数据中的数学模型和模式，这些模型和模式可以表明效果指标与业务 KPI（例如，转化率和单页访问百分比）之间的关联，从而从新的角度了解网站速度和用户体验对企业的财务影响。这样一来，业务决策者就可以用同一种语言讨论绩效。分析结果涵盖所有核心网页指标以及 Farfetch 认为有价值的其他指标。并获得了真正有影响力的数据洞见。
Google 建议将 Largest Contentful Paint (LCP) 控制在 2.5 秒以内，以提供最佳用户体验，因此 Farfetch 仔细研究了这一阈值，并发现了有意义的结果。
Farfetch 的统计相关性分析表明，在此之后，转化率开始下降，退出率上升。这表明，用户真正开始感受到网页加载速度较慢的不利因素，并且 LCP 每增加 100 毫秒，转化率平均会降低 1.3%。
Farfetch 团队还发现，Cumulative Layout Shift (CLS) 得分每减少 0.01，退出率就降低了 3.1%，这再次证实了网页稳定性在促使用户留在网站上方面带来的影响。
在网页的互动性和流畅性方面，Farfetch 会持续跟踪和分析首次输入延迟 (FID)，但也会衡量 TTI，事实证明，这是一项对 Farfetch 业务转化漏斗的影响重大指标。
为此，他们将 Google 的 TTI polyfill 注入了网站，用于存储此指标。使用 Long Tasks API 报告耗时较长的任务（在浏览器主线程上花费的时间超过 50 毫秒的任务）。
然后，分析团队发现，TTI 每秒减少后，转化率就增加了 2.8%，这为提高代码效率和清除浏览器主线程提供了有力的理由。
最后，此分析还表明，一些指标对业务 KPI 没有显著影响，而有些指标在用户体验历程的不同阶段更相关。这样一来，您就可以全面了解转化漏斗中每个阶段可用的业务机会。
第 3 步：融入文化变革
展示上述见解以及关于用户对网站速度的看法的定性用户调查至关重要，这有助于与公司目标保持一致，确保高管层对基于效果的决策表示认可，并在各个产品路线图上给予支持。现在，我们能够证明 Farfetch 的性能价值有多高。
为了简化优先级排序，Farfetch 从 Google 的速度影响计算器中汲取灵感，开发了一款自助工具，将其命名为“网站速度业务用例计算器”。它让任何产品经理都可以通过实时计算业务影响来创建一个业务用例，从而提升业绩。通过利用转化率与用户体验指标之间的关联的数据模型，我们可以灵活地适应不同的产品范围、设备和用户体验历程接触点。
同时，他们通过一组自助式分析信息中心，在整个企业范围内查看实时绩效指标及其对业务的影响。现在，性能已经完全融入产品开发中，产品团队可以轻松访问指标、审核工具和性能预算监控。此外，由于数据层集成，Farfetch A/B 测试工具上也提供了效果指标，这为产品经理提供了又一个强大的数据洞见。
最近几个月，核心团队也在努力在前端开发团队和平台领域内建立这种文化，使用类似的方法监控和证明主要微服务和事务的影响。
许多 Farfetch 驱动的演示文稿都围绕这一主题，不过也向外部用户提及了。例如，在 2021 年 Google I/O 大会上关于核心网页指标对业务影响的演讲中提到了这一点。这也有助于使该团队持续与主题相关，并巩固团队在文化方面的策略。
第 4 步：提升指标
最后，所有这些工作都需要帮助 Farfetch 客观地提高其网站速度指标，并确保其团队能够遵循最佳做法并寻找改进机会。
2021 年，我们发现的一个主要机会是，需要改进 Farfetch 的两种主要页面（商品页面和商品详情页面）的 LCP。
相关团队解决了他们加载这些网页的主要内容的方式。他们凭借一个商业案例，证明了抓住这一机遇的影响，他们得以：
- 将商品图片加载组件从基于 JavaScript 的解决方案调整为原生实现。
- 定义图像的优先级，并将其分为关键资产和非关键资产。
- 尽早加载关键图片，将源代码内嵌在 HTML 中，并使用
<link rel="preload">，以便尽快下载。 - 对非关键图片使用
<img loading="lazy">属性，并在不受支持的浏览器（例如 Safari）上使用 Intersection Observer 进行 polyfill。
通过这种方式，他们能够改变现状，并通过 A/B 测试证明假设和业务影响。例如，在产品页面上，这项工作缩短了 600 多毫秒，A/B 测试表明，在公司定义的置信度下，转化率的提升幅度在 1-5% 之间。
根据 Google 对 LCP 得分的定义，该团队在被认为是“良好”“需要改进”和“欠佳”的网页浏览量所占百分比方面做出的改进如下。
提高网站速度和改进工作实践带来的回报
围绕性能打造文化，并利用业务用例计算器等工具，让每个人都可以开始说同一种语言，以便产品经理、利益相关方以及工程师都能理解。因此，他们纷纷围绕如何确定新举措的优先顺序和提升效果展开讨论。
Farfetch 公司网络频道高级产品经理 Rui Santos 解释道：“我们希望打破性能问题，打破只关注技术的问题，打破这种问题，只有工程团队负责处理和修正问题。”“将效果指标与业务指标联系起来非常有效，可以非常迅速地传达讯息。业务推动公司发展，将成功与速度指标联系起来，这促使更多利益相关方了解并做出权衡决策。”
在奢侈品电子商务细分中，您的网站是快还是慢可以决定消费者如何看待您的品牌以及您的整体服务质量。对用户而言，质量等同于奢华，这涉及到用户体验的方方面面，包括您网站的表现。经过实践检验，网站速度对转化率产生的影响，在 Farfetch 公司进行未来规划时，网站性能发挥着稳妥的引领。