PageSpeed 与真实用户监控：有何区别？
作者：互联网
作为 Web 开发人员，我们知道我们的网站和应用程序的性能对于提供出色的用户体验至关重要。Core Web Vitals是衡量网站或应用程序性能和用户体验的一组指标，是其中的一个重要因素。为了评估和改进性能，我们拥有一系列可供使用的工具和技术，包括PageSpeed和真实用户监控 (RUM)。在本文中，我们将分解 PageSpeed 和 RUM 之间的差异，以及如何将它们结合使用以从您的网站或应用程序中获得最佳性能。
什么是 PageSpeed？
PageSpeed 是 Google 创建的一种工具，可帮助网络开发人员提高网站运行速度。PageSpeed Insights 分析您网站的性能并为您提供改进建议。
什么是真实用户监控？
真实用户监控 (RUM) 是一种涉及从用户的角度跟踪和测量网站或应用程序性能的技术。RUM 涉及在用户与网站或应用程序交互时收集用户数据，并使用这些数据了解网站在现实世界中的表现。
PageSpeed 和真实用户监控有何不同？
PageSpeed 和 Real User Monitoring 之间有几个主要区别。主要区别在于 PageSpeed 是一种合成工具，而 RUM 是一种真实世界的监控工具。这意味着 PageSpeed 会在受控环境中分析网站或应用程序的性能，而 RUM 会跟踪真实用户使用网站或应用程序时的性能。
另一个关键区别是 PageSpeed 专注于优化网站或应用程序的性能，而 RUM 则专注于测量和跟踪性能。这意味着 PageSpeed 提供改进建议，而 RUM 提供有关网站或应用程序在现实世界中的表现的数据。
如何采用真实用户监控
真实用户监控 (RUM) 是前端 Web 开发人员的宝贵工具，可以深入了解他们的网站或应用程序在现实世界中的表现。根据 Web 开发人员的需要，可以通过几种不同的方式采用 RUM。
谷歌分析
第一种方法是使用内置于网站或应用程序中的 RUM 工具，例如 Google Analytics。使用web-vitals npm 包，可以将原始性能数据发送到 Google Analytics。、onCLS和函数允许 Web 开发人员onFID分别onLCP跟踪 Cumulative Layout Shift、First Input Delay 和 Largest Contentful Paint 指标。通过将此数据与 Google Analytics 结合使用，Web 开发人员可以更全面地了解其网站或应用程序的性能。
import {onCLS, onFID, onLCP} from 'web-vitals';
function sendToGoogleAnalytics({name, delta, value, id}) {
gtag('event', name, {
value: delta,
metric_id: id,
metric_value: value,
metric_delta: delta,
});
}
onCLS(sendToGoogleAnalytics);
onFID(sendToGoogleAnalytics);
onLCP(sendToGoogleAnalytics);
但是，这种方法有一些缺点。这些缺点之一是有限的仪表板和糟糕的用户体验。使用仪表板可能难以导航和理解，从而更难解释数据。此外，可用于跟踪的指标仅限于 Core Web Vitals 指标。如果需要更详细的分析，则可能需要采用不同的方法。
第三方软件即服务
第二种方法是使用第三方 RUM 工具，例如New Relic或Loado。这些工具比 Google Analytics 更强大，允许 Web 开发人员更详细地跟踪性能。
Loado 是一款功能强大的真实用户监控 (RUM) 工具，可为前端 Web 开发人员提供一系列功能。它为那些刚起步的人提供免费计划，允许 Web 开发人员跟踪性能而无需任何前期费用。它还包括内置警报，可以帮助 Web 开发人员快速识别和修复任何性能问题。Loado 提供的仪表板和报告可以轻松解释数据并跟踪网站或应用程序随时间推移的性能。
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<title>Your awesome website</title>
<script async src="https://cdn.loado.dev/sdk.js" />
</head>
<body>
</body>
</html>
此外，Loado 通过 User Timings API 支持自定义指标。这使 Web 开发人员可以更详细地跟踪性能，并更好地了解他们的网站或应用程序在现实世界中的性能。通过使用 Loado，Web 开发人员可以更有效地跟踪和改进其网站或应用程序的性能。
专属定制服务
第三种方法是构建自定义 RUM 解决方案。这需要对 RUM 有更详细的了解，并且设置起来可能很耗时。然而，它可能是跟踪性能的最具成本效益的方式，并允许 Web 开发人员以适合其特定需求的方式收集数据。
无论采用哪种方法，RUM 都可以成为跟踪网站或应用程序性能的强大工具。通过使用 RUM，前端 Web 开发人员可以更好地了解他们的网站或应用程序的性能，并就如何改进它做出明智的决定。
PageSpeed 和真实用户监控如何结合使用？
尽管 PageSpeed 和 Real User Monitoring 是具有不同目标的不同工具，但它们可以一起使用以最大限度地提高网站或应用程序的性能。以下是结合使用这些工具的一些提示：
- 使用 PageSpeed Insights 确定需要改进的地方：PageSpeed Insights 是一个很好的工具，可以确定网站或应用程序可以优化的地方。通过使用此工具，您可以识别影响性能的特定问题并获得有关如何解决这些问题的建议。
- 使用 RUM 跟踪更改的影响：实施来自 PageSpeed Insights 的建议后，您可以使用 RUM 跟踪这些更改对您的网站或应用程序性能的影响。这将帮助您了解更改是否产生了预期的效果，并确定可能需要的任何进一步改进。
- 监控实验室和现场数据：监控实验室数据（使用 PageSpeed 收集）和现场数据（使用 RUM 收集）以全面了解您的网站或应用程序的性能非常重要。通过结合这两种类型的数据，您可以识别可能影响性能的技术问题和用户体验问题。