毫无疑问,构建Web应用程序需要大量工作。 您不仅必须设计,调试和交付快速的服务器端应用程序,而且必须在设计,调试和交付快速的客户端应用程序上花费相同的时间和精力。 这意味着整个开发过程中涉及的每个人都需要共同努力,以确保其应用程序以最佳性能运行。
当然,有很多面向性能的开发工具可供开发人员使用,以确保他们的客户端代码尽可能快,但是这些工具收集的数据充其量只是理论上的。 只有真正的用户启动并使用了应用程序之后,您才能真正了解应用程序的性能。 这就是您和您的团队需要Raygun Real User Monitoring的原因 。
Raygun Real User Monitoring提供了针对Web,移动和桌面应用程序的前端Web性能监视 。 它使您能够评估和分析软件对实际用户的性能。 如果您对此表示怀疑,请不要。 Raygun拥有多年监视应用程序性能的经验,提供了开发人员用来查找和分析错误和性能问题所依赖的世界一流工具。
跟踪应用程序的性能
在将Real User Monitoring集成到您的应用程序之后,该过程很简单,就像在应用程序模板中包含两个脚本元素一样,该服务开始接收有关用户体验的数据-他们访问的页面/视图,为这些页面/视图下载的资产,他们转移和渲染所花费的时间,以及有关用户本身的信息。
在主仪表板页面上,您会看到应用程序的通用性能。
![主仪表板](https://i-blog.csdnimg.cn/blog_migrate/a05c0cfe1f4f8875e00cf754f528371f.png)
主图直观地显示了应用程序的整体性能,详细列出了以下应用程序性能指标的平均值,中位数,第90个百分点和第99个百分点:
- First Paint —从导航到浏览器将第一个像素渲染到屏幕之间的时间。
- 第一个内容丰富的绘画 -浏览器呈现内容的第一部分。
- 加载时间 - 加载整个页面所花费的时间。
从那里,您可以获得用户最常访问的页面列表。 这是非常重要的信息,因为它为您提供了您应重点关注的页面/视图。 是的,所有页面都很重要,但让我们成为现实-有些页面比其他页面更重要。
在仪表板上,您可以快速查看最需要的页面的加载时间。
![需求最多的页面表](https://i-blog.csdnimg.cn/blog_migrate/51fe2ef246fc6c55f9472e3372889ac7.png)
单个页面的加载时间分为几个值:
- DNS查询
- 延迟-主机接收,处理和响应的时间
- SSL握手时间
- 服务器-服务器处理所需的时间。 这也与Raygun应用程序性能监视(APM)息息相关,因此您可以详细了解哪些代码处理了请求。
- 转移-页面必须等待资产下载的时间
- 渲染
- 子级-处理异步资产的时间
当然,要塞入如此小的图形中会有很多信息,因此“真实用户监视”使您可以深入研究每个单独的页面并查看有关该页面性能的详细信息。
即时用户监控功能可为您提供直方图,详细显示页面的性能分布。 有了它,您可以轻松查看该页面对所有用户的效果如何。
![网页效果的直方图视图](https://i-blog.csdnimg.cn/blog_migrate/17306622bf8670c8866159c8bd4a1216.png)
该视图的最佳功能之一就是直方图本身。 单击任何条形可以让您详细查看在该时间范围内访问页面的各个用户会话。 从这里,您可以轻松确定用户趋势:他们使用的浏览器和OS,以及会话IP所提供的大致位置。 您还可以访问单个用户在应用程序中的旅程(稍后会有更多介绍)。
![查看特定页面的会话](https://i-blog.csdnimg.cn/blog_migrate/a2ba7a966ac65eb73996ace25976cc50.png)
Real User Monitoring还列出了单个页面的所有下载资产(及其相应的加载时间值),并列出了XHR请求及其加载时间性能信息。
整体性能只是Real User Monitoring为您提供的图片的一部分; 您还可以查看用户的独立会话!
查看会议
实时用户监视使您能够准确了解应用程序对每个用户的性能,并使用瀑布图为每个页面请求提供详细的诊断信息。 简而言之,您可以通过应用程序来追溯用户的旅程。
![用户浏览应用程序](https://i-blog.csdnimg.cn/blog_migrate/fd24d71f5c2249320e9039fffe48e002.png)
这真是太神奇了,因为它为您提供了用户如何体验您的应用程序的详细视图。 您不仅会学习用户如何访问您的应用程序(例如浏览器,操作系统和设备),而且旅程的每一步都将提供有关用户如何体验页面的详细信息。 这是实例级数据! 您将看到如何为单个用户的单个页面访问加载单个页面及其资产。
![显示用户实例的统计信息访问页面](https://i-blog.csdnimg.cn/blog_migrate/1f0c78b8f7a501798876a6e696c13aa1.png)
尽管用户的体验对于理解应用程序的性能至关重要,但有时您需要更广泛的了解,重点是浏览器和平台。 真正的用户监控已覆盖您。
系统统计
在理想情况下,某人使用的浏览器和/或操作系统不会影响应用程序的运行方式,但是我们都知道浏览器和操作系统的行为会有所不同,并相应地影响性能。 这就是为什么“真实用户监视”为您提供有关用户系统的详细性能驱动信息的原因。
![浏览器使用情况数据](https://i-blog.csdnimg.cn/blog_migrate/8ed2d79b567b87776d6b8dff68e631cb.png)
您不仅可以更好地了解用户使用的系统,还可以为每个浏览器和操作系统提供平均加载时间。 您将能够轻松发现某些浏览器版本的性能问题,从而深入了解需要定位和测试更多浏览器。
比较数据
真实用户监视的更有趣的方面之一是能够比较不同的平均维度。 例如,您是否想查看Windows 10和macOS之间或Chrome和Firefox之间的性能差异? 您可以!
![比较Chrome和Firefox中的性能](https://i-blog.csdnimg.cn/blog_migrate/98c54f5b8b25b127b8ff6332ecc0c078.png)
但是OS只是一维。 您可以比较浏览器,设备,城市,州,国家和应用程序不同版本之间的统计信息。 后一个维度非常有用,因为它可以使您了解新版本在性能上与旧版本相比如何。
实时监控
但也许最有趣的功能是实时监视。 是的,您可以在用户访问和浏览应用程序时获取和查看性能数据。 这为您和您的团队提供了对影响您的应用程序的性能问题的可行见解。
![实时监控图](https://i-blog.csdnimg.cn/blog_migrate/acaff3e494cc2ddb5cbc4c1dc9ccf2a1.png)
“实时”选项卡使您可以实时了解站点的性能,以及24小时内的实时请求,地理位置分布和会话趋势。 使用交互式地图,您可以查看活动的会话位置和会话号。
我的经验
我在构建的实时非演示站点( 用于测试Raygun Application Performance Monitoring的同一应用程序)上简短地测试了Raygun Real User Monitoring。 基本设置很容易。 我只是在网站模板中添加了两个脚本元素; 但是,我本可以花费更多时间将Real User Monitoring集成到我的应用程序中,以接收更彻底的数据,例如错误报告和用户信息。
我几乎立即开始看到用户体验数据,并且对我的应用获得的低分感到震惊(不是真的:我知道它会出现问题)。 但是令我最惊讶的是用户的旅程-能够追溯用户通过我的应用程序执行的步骤,并看到他们的体验确实很棒。
绝对用户监控绝对是您想要在应用程序中使用的工具,用于分析应用程序的性能和用户体验。
结论
Raygun Real User Monitoring是一项出色的服务,可用于监视应用程序的性能。 它描绘了用户如何体验您的应用程序的完美画面,清楚地指出了使应用程序变慢的页面和视图。
翻译自: https://code.tutsplus.com/tutorials/raygun-rum-know-your-users-experience--cms-34817