使用 Raygun Pulse 监控您软件的心跳

也许你和我一样，在公共网络上有几个正在运行的网站或应用程序（根据你的服务器监控显示，它们运行良好）。你没有听说过内存或处理器利用率问题，甚至可能将其放在 Azure 等公共云服务上，当请求量激增时，它会自动扩展并添加新服务器。但是，用户，也就是你网站的访问者，他们的体验好吗？网站在浏览器上的真实性能如何？你如何测试这些事物，并了解它们对访问者和客户的吸引力如何？

我在 Raygun 的网站上听说过 Raygun Pulse 产品，当时我正在寻找一种方法来衡量我的 Azure 博客是否能以适当的速度向我的访问者提供内容。Raygun 还为所有主流编程语言和平台提供实时错误和崩溃报告，但目前，我确实想深入研究这些性能问题以找到一些答案。

我的博客不每天发布新内容，但当我发布新内容时，我希望我的云服务能够处理负载，并且我认为我已经配置好了。至少我认为我已经正确配置了我的博客…我决定尝试 Raygun Pulse 并将其连接到我托管在 Azure 上的 Wordpress 博客进行一些性能检查，但你可以对任何你想监控的网站使用 Pulse，并且很快就会支持移动应用程序。

注册并开始

Raygun 的入门过程非常简单。我能够用我的 Twitter 账户注册，并在 www.raygun.com 网站上申请 Pulse 监控系统 30 天的演示，整个过程只需几秒钟。然后，我开始了一个简短的配置应用程序以供 Raygun Pulse 使用的过程。

1. 我将我的应用程序名称提交给了 Raygun 配置

   

2. 我选择了 Raygun 的哪些功能要在此应用程序中启用

   

3. 然后，我能够选择我的应用程序框架，并获得针对该框架的说明来配置标准的 Raygun 监控。会为该应用程序分配一个 API 密钥并进行报告，以便在应用程序配置中使用。就我而言，有一个 Wordpress 插件，我从 Wordpress 管理控制台安装了名为“Raygun4WP”的插件。
4. 在我的博客下载并安装插件的短暂暂停后，我在我的博客控制台中填写了一些配置信息。

   

   这个控制台非常易于理解，让我能够配置我在注册过程中配置的电子邮件地址中想报告的相应 Wordpress 错误。API 密钥是我在步骤 3 中为该应用程序报告的密钥。标签是您可以用来帮助在 Raygun 控制台中识别应用程序错误的字符串。最后，要忽略的域是一个逗号分隔的列表，从中应忽略访问和错误。这对于防止由您的公司域生成的测试请求或管理操作产生的错误报告非常有用。

5. 最后要配置的是我 Wordpress 主题中的一些 JavaScript，用于捕获和记录浏览器感知的性能。在配置过程的最后一步，Raygun 网站会提供说明和 JavaScript 代码片段。Raygun JavaScript 库可以从内容分发网络请求，因此您的应用程序无需安装任何外部库。还有一个小的代码片段可以激活 Pulse 监控代理。

   我将这两个脚本从 Raygun 网站复制到我的 Wordpress 主题使用的 header.php 文件中，将它们插入到页面上的 </head> 标签之前。

保存完最后一个文件后，我导航到我的 Raygun 仪表板，已经看到了一些关于我的 Wordpress 应用程序错误跟踪和访问者状态的信息。但是，我真正感兴趣的是 Pulse 提供的访问者性能信息。我通过选择屏幕左侧的 Pulse 菜单选项来访问它，并开始查看 Pulse 关于我的访问者体验的见解。

我的博客 Pulse 一览

坦白：我让 Pulse 运行了一段时间，并发布了一篇新博文，以便我能看到一些新访客访问我的博客并进行 Pulse 监控。最初的结果简直出乎我的意料。

Pulse 仪表板的第一个屏幕显示了访问者“大致”的地理位置以及他们网站体验的一些总体信息。就我而言，我有一些来自北美、西班牙、非洲和亚洲的访问者……我从不知道我竟然有来自非洲的博文读者！我还可以从仪表板顶部看到我的访问者正在经历糟糕的体验，加载时间长达八秒……这不好。根据之前的研究，我知道在访问者认为您的网站速度慢并决定去别处之前，页面的请求时间应该少于 500 毫秒（半秒）。

哦，而且这个屏幕正在我眼前实时更新。Pulse 仪表板就像我自己的个人网站 NORAD，实时向我报告应用程序体验信息。我看到在上面截屏后不久，来自加拿大东部甚至英国的一些请求开始进来。很有趣……地图上的绿色闪烁点很有趣，但它们似乎并不打算准确。此外，我无法在此放大地图，也无法查看更多来自欧洲的访问者详细信息，但我可以从 Geo 选项卡中获得更好的地理信息，我稍后会展示。

在花了​​几分钟看着地图上闪烁着访问我博客的朋友和读者后，是时候开始处理正事了：为什么我的博客如此缓慢？我开始通过点击仪表板顶部的“性能”链接来深入研究我的问题。

看看这个，性能被评为“差”，我的页面的中位数加载时间为 2 秒，而第 90 百分位数甚至更慢，报告为 8 秒，第 99 百分位数报告为 47 秒加载时间！哎哟……下面列出了最常访问的页面，我看到了一个明显的趋势：这些页面加载时间中的蓝色部分（表示服务器负载时间）非常小；我的 Wordpress 服务器在快速提供 HTML 方面做得很好。然而，这些页面上表示为紫色的子对象和引用加载起来非常慢。让我们进一步深入，点击第一篇文章的名称。

我可以看到这个页面被评为性能差，加载时间很糟糕。进一步研究发现，服务器在 645 毫秒内提供 HTML，这对于服务器获取和提供 HTML 来说是一个不错但不是很好的时间。在浏览器中渲染内容花费的 2267 毫秒是一个问题。让我们进一步研究它以及花费 2354 毫秒加载的子元素。

现在事情变得更清楚了。根据对这篇博文近 300 次访问的采样，很明显，所提供的内容存在一些问题。有 50 个图像、脚本和 CSS 文件托管在我的服务器上或别处，加载它们需要很长时间。这些红蓝线分别是传输时间和服务器渲染时间。两者都远远超过了此静态内容的用途，我应该对此做些什么。此外，此页面还有太多的额外请求。诚然：我使用了来自 gist.github.com 的几个代码嵌入脚本来格式化页面上的示例代码，但此页面上的项目仍然太多。我真的需要 Twitter 侧边栏和博客上的小部件吗？可能不需要，而且我可以为访问者节省大约十几次内容请求。

我还是一个 Wordpress 插件的受害者，这些插件为我做了很多工作，并在页面上注入了额外的脚本。我能消除这些内容并将它们重写成更简单、更容易传递的东西吗？绝对可以，而且我知道哪些项目有问题以及要针对哪些目标。这些性能视图中 7 秒以上的长线条需要被消除。

使用的平台怎么样？

我看到了顶部的“平台”按钮，决定查看我的访问者正在使用的平台或操作系统列表。鉴于我写了很多关于 .NET 和 Microsoft 的内容，我预计会有大量的访问者来自 Windows。我猜对了，但也找到了性能问题的另一个关键点。

虽然我的访问者中有 83% 使用 Windows，但有 11% 使用移动操作系统。更进一步，移动访问者的博客体验明显更差。看看 11 月 10 日的数据：移动设备的平均加载时间超过 30 秒。这些信息，加上关于我的博客上加载的非常慢的图像的数据，促使我想重新审视我安装的专门支持移动访问者的 Wordpress 插件，并考虑更新我的主题以使用更小的图像。

我还可以考虑的另一个选择是将我的网站使用的其中一些标准库移至 Azure 存储。我可以使用一些串联来压缩图像、JavaScript 和 CSS，并从一个应该更快渲染的不同 URL 提供这些资产。

地理位置是否是一个问题？

我想再看最后一件事，因为我之前对有来自非洲的访问者感到惊讶，我从未考虑过他们的地理位置可能是导致性能问题的原因。当我点击仪表板顶部的 Geo 选项卡时，我可以看到世界地图和相对速度的指示器，以及各地区的加载时间细分。

在此截图时，我的大多数访问者来自欧洲，我对此感到很有趣，因为我的写作倾向于以美国为中心。仔细看看，我可以看到加载时间最慢的来自尼日利亚和印度尼西亚。关键是：我的博客运行在北美的一个服务器上，所以与那些访问者来说，我已经有了距离问题。由于巴西是访问速度最慢的第四个国家，也许我可以考虑让 Azure 将我的静态内容复制到南半球的一个数据中心。如果我的主存储在北美，并在巴西运行一个只读备份，我应该能够提供更好的性能，并且在北美主数据中心发生故障时，还能实现内容的分布式备份。

摘要

只需 upfront 投入 10 分钟配置 Raygun Pulse 来监控我的 Wordpress 博客，我就可以免费试用几天，看看它的性能如何。在发布一篇新博文以帮助产生一些流量后，我能够立即在仪表板上实时看到我的网站访问者。我可以看到我的博客运行缓慢的地方，并找出我的 Web 应用程序引用的插件和库中的痛点。现在，当我着手优化我的博客以获得更好的性能时，我有一个可以与之比较的基线。