原文作者：Jeffrey Lee Smith
A Real User Monitoring (RUM) tool can help give visibility into problems like pages loading too slowly.
Here we’ll take a look at the Real User Monitoring solution that Raygun provides, and dive into how those tools can help you to locate and resolve loading issues.
在这里,我们将了解Raygun提供的Real User Monitoring解决方案,并深入研究这些工具如何帮助您查找和解决加载问题.
Speed and page loading issues are some of the most frustrating issues to troubleshoot. Errors that crash applications or break functionality are often both easier and more urgent to deal with. Loading issues, on the other hand, lack that urgency, but cause great annoyance to end users of your application. They can’t be ignored.
A large percentage of users of websites and web apps will abandon their efforts if the pages load too slowly. When users are forced to use slow-loading applications due to lack of choice, or workplace decisions, the slowness is often all they see or remember. Performance issues like slow loading pages cloud the entire experience for everyone involved.
A Real User Monitoring (RUM) tool can help give visibility into these problems and more. Software teams use RUM tools to:
Let’s take a look at the Real User Monitoring solution that Raygun provides, and dive into how those tools can help you to locate and resolve loading issues. This will help you to provide a fast browsing experience for your users.
让我们看一下Raygun提供的Real User Monitoring解决方案,并深入研究这些工具如何帮助您查找和解决加载问题.这将帮助您为用户提供快速浏览体验.
Set up Real User Monitoring(设置真实用户监控)
Firstly, you’ll need to take a trial of Raygun Real User Monitoring. The trial is free for 14-days, and plans start from just $8 per month.
首先,您需要试用Raygun Real User Monitoring.试用期为14天,免费,计划每月仅需$ 8.
From there, you’ll be prompted to include the Raygun library in your application:
Next, you’ll need to add a configuration script that tells Raygun what service you are enabling, and presents an API key to identify your application.
You’ll want to replace the API key with your own, which you can get from your Application Settings screen. Lastly, if you wish to enable user tracking, insert a user tracking snippet at the end of the previous one, making it now look similar to this:
fullName: 'Ronald Raygun',
Once you have everything working, you can, if you choose, connect the user tracking variables to the currently logged in user profile in your app, adding their name, email, or ID to these fields rather than the placeholders. This should be done with all consideration for privacy laws, GDPR, and any other personal information regulations your application needs to comply with. It could also be done in individual circumstances, with user permission, in order to help troubleshoot problems, if you didn’t wish to enable de-anonymized per-user tracking globally.
In any case, there we have it, you should be receiving application data in Raygun now.
Investigate Slowest Requests(调查最慢的请求)
The Slowest Requests module in Raygun Real User Monitoring brings you instance-level information about any particular request by a user. This can include information such as the user’s geography, browser, device, operating system, timestamps, and more. In addition, you can also see all of the requests that were made in order to load that page for the user, and the time taken for each.
Raygun Real User Monitoring中的Slowest Requests模块带给您实例级有关用户的任何特定请求的信息.其中可以包括用户的地理位置,浏览器,设备,操作系统,时间戳等信息.此外,您还可以查看为向用户加载该页面而发出的所有请求,以及每个请求花费的时间.
The timing of these requests can be of great importance when troubleshooting. It can allow you to, for example, verify that certain requests are being made asynchronously (or not), and to understand if any one request is causing a delay and blocking the rest of your requests.
Sometimes a particular request is not all that slow, but it is blocking other requests instead of occurring asynchronously, in which case everything else that the application is trying to load will be cumulatively slower. One small delay can stack with others to add a great amount of loading time for your users.
Additionally, you will also be able to monitor AJAX requests, which allows you to see which bits of data are loading behind the scenes and perhaps locate a culprit that is making the user experience feel slow.
This set of information will give you a solid understanding of which requests are consistently slow, and whether the problem is only seen by some contextual set of users, or if it is behaving similarly for everyone who uses your site.
Monitor Response Code Trends(监视响应代码趋势)
The Response Codes module in Raygun RUM is particularly useful in applications with a high amount of XHR/AJAX calls or if you monitor single-page applications. These calls happen behind the scenes, and often do not entirely break the user experience upon failing. They can, however, cause speed issues. If there are a lot of background requests being made, or worse, failing and continuing to repeatedly be tried again, this could lead to a subpar experience for the users of the application, both because of the broken functionality and because of the added slowness of the application and resulting user experience letdowns.
The Response Codes module allows you to easily monitor the responses of those XHR calls, and keep track of the general trend of response codes. You can also pinpoint particular requests that fail more often than others, see when an update causes a spike in failure responses, and even see which URIs cause the most response code counts.
Additionally, the Response Codes module provides value beyond just seeing and dealing with failures; it also gives you insight into successes. The amount of successful XHR requests and what those requests were can give you a sense of how your application is doing, how engaged the users are, and what they are doing while in the UI.
Both the troubleshooting and the insight into successes will allow you to create a more streamlined experience for your users, eliminate load problems, and double down efforts to improve areas of the application that your users find to be the most important.
Analyze First Paint Metrics(分析第一个绘画指标)
Raygun also surfaces user-centric performance metrics around the concept of “First Paint”.
Raygun还围绕” First Paint“的概念浮出水面,以用户为中心的性能指标. .
- First Paint (FP) (头漆(FP))
- First Contentful Paint (FCP) (首次合格涂料(FCP))
With modern-day browsers, fast broadband, and a well-built application, it is possible that the naked eye could have trouble perceiving any differences at all between FP and FCP, or even between either of those and the fully loaded page. Where this metric can become devastating, though, is in applications with a higher percentage of users who are on slower broadband (or lower speed internet), less current mobile connections, and other precarious connectivity situations. Then, the FP metrics can become the difference between a user who engages with your product or a user who walks away.
Put It All Together(放在一起)
One of the first things you’ll need to do is gather data for a long enough period of time to be able to ascertain what the normal trends look like for your system. Load issues are often going to be consistent and pervasive. You will be able to see errors and broken things immediately using Raygun’s Error Tracking software, but for load issues, you will often want to look at data over time and not spend resources trying to solve isolated incidents.
Once you have enough data to have a strong feeling that “this type of user has loading issues in this area of the application” you can begin to zero in on the parts of the application that need adjusted in order to create that snappy experience that the customer is looking for.
RUM will show you which requests for which resources are the slowest, or which of those block loading others. You’ll be able to segment loading issues to geographic regions, raising questions of the need for a CDN, perhaps, or to determine that only users accessing a particular area of the application experience certain loading issues.
Solutions for Slow Load Times(缓慢加载时间的解决方案)
Once you have done your research using RUM and have determined which requests and resources are the potential trouble areas, there are a variety of solutions to improve web performance out there, depending on the exact problem and the resource in question:
使用RUM完成研究并确定哪些请求和资源是潜在的麻烦区域后,可以使用多种解决方案来[改善Web性能](https://raygun.com/learn/the-ultimate-guide-到网络性能？utm_medium =sponsorpost＆utm_source =codeproject＆utm_campaign =devmedia＆utm_term =rum＆utm_content =article),具体取决于确切的问题和相关资源:
There are many other ways to help load times that we aren’t covering here, but the above are a few of the biggest aids to resolving load times for users.
Visualize Data - Before Resolving Problems and After(可视化数据-解决问题之前和之后)
Once you’ve implemented one or more of these solutions for the problems you’re facing, you can compare the current page load trends with those from a period of time before the changes were implemented, and see fairly quickly which solutions worked, and which ones did not significantly impact the load times that your users are experiencing.
The key in all of these cases is to have good data before and after a fix (and in many cases, before and after a problem occurs, which can also help you pinpoint where the problem was introduced) and good visualization of that data.
That’s exactly what Raygun’s Real User Monitoring is providing: data collection and aggregation which can then be presented in such a way that you can draw clear, actionable conclusions from it without spending hours upon hours researching and attempting to find the cause of loading issues.
With Raygun, you can just see the problems right there in the dashboard, presented in just the way you need it. You can then use the time you might have wasted hunting issues to instead solve those issues, and make your customers even happier with your applications.
With plans starting at just $8 per month, Raygun Real User Monitoring is a cost-effective way of effectively identifying and diagnosing front-end performance issues. Sign up for a free 14-day trial today.
计划每月起价仅为8美元,Raygun Real User Monitoring是有效识别和诊断前端性能问题的一种经济高效的方式. 今天就免费注册14天.
本文以及所有相关的源代码和文件均已获得The Code Project Open License (CPOL)的许可。