用ARMS前端监控诊断页面缓慢问题

诊断页面缓慢的问题

以下步骤演示了一个排查策略示例的具体步骤：

1. 登录ARMS控制台，在左侧导航栏选择前端监控 > 前端列表。
2. 在前端列表页面顶部选择目标地域，然后单击目标应用名称。
3. 在左侧导航栏选择应用 > 访问速度。
4. 在页面加载时间详情区域和页面加载瀑布图区域查看关键性能指标是否有异常：

   

   

   • 如果页面加载详情区域的首次渲染时间偏高，或页面加载瀑布图区域的DNS查询、TCP连接和SSL建连耗时偏高，表示页面打开缓慢可能是由网络原因造成的，那么您需要检查网络问题。
   • 如果页面加载详情区域的DOM Ready耗时偏高，或页面加载瀑布图区域的请求响应和内容传输耗时偏高，表示页面打开缓慢的原因可能是API请求缓慢，那么您需要执行步骤4进行排查。
   • 如果页面加载详情区域的页面完全加载时间偏高，或页面加载瀑布图区域的DOM解析和资源加载耗时偏高，表示页面打开缓慢的原因可能是前端资源加载缓慢，那么您需要执行步骤5进行排查。
5. 在左侧导航栏选择应用 > API详情。
   1. 在API请求列表页签，单击目标API右侧操作列的分析。
      
   2. 在API详情页签，单击请求详情区域右上角的查看调用链，查看前端监控的整体耗时和后端应用的调用时序图：
      

      • 如果后端应用处理时间较短，而整体耗时较长，则说明API请求从发送到服务端以及从服务端返回数据到浏览器端的网络传输耗时较长。在此情况下，可以在API详情页面，单击请求详情区域右上角的查看会话，查看本次访问的网络制式、地域、浏览器、设备和操作系统等信息。
      • 如果后端应用处理时间较长，则说明后端处理的性能较差。此时可在方法栈栏中单击放大镜图标，然后在方法栈对话框中查看后端链路上哪部分内容耗时较长，继而定位问题。
6. 在左侧导航栏选择应用 > 访问速度。
7. 在访问速度页面的慢页面会话追踪（TOP20）区域，单击目标慢会话的页面名称。
   
   在会话追踪页面的页面资源加载瀑布图区域，您可以查看导致页面打开缓慢的资源详情。

更多信息

• 页面访问速度
• 用ARMS前端监控诊断JS错误