功能说明

<p><a name="_Toc528595110">概览</a></p> <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 概览页面主要显示WEB应用的性能概况信息,包括APDEX、PV(PageView)、整体性能、页面渲染、JS错误率、HTML加载时间等信息。</p> <p><a name="_Toc528595111">应用拓扑</a></p> <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 应用拓扑为您提供应用总体信息,通过拓扑图可以直观分析,从客户端来源到页面组成过程的性能以及错误概况。</p> <p><img src="https://obs-cn-shanghai.yun.pingan.com/pcp-portal/20183110104509-1e5fc06e96ad.png" style="height:282px; width:511px" /></p> <p><a name="_Toc528595112">页面分析</a></p> <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Web应用的页面包含了很多元素,如JS脚本、CSS样式表、PNG图片等,页面也需要加载许多资源,如第三方的插件、广告、跨域的资源,这些资源的加载缓慢或是加载是否成功都会影响到用户体验。为此,如何更加精准的去衡量浏览器端真实用户的性能体验?浏览器监控服务提供了丰富的图表、技术指标以及详细的快照信息,方便页面开发者定位问题原因。</p> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 页面分析模块从页面概况到页面快照与资源分析,提供了页面元素级的性能分析。</p> <ul> <li>页面概况信息</li> </ul> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 点击某个页面URL后,展示该页面的页面概况信息,以时序分解图以及各步骤指标趋势图丰富的展现了页面性能信息:</p> <ul> <li>页面快照分析</li> </ul> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 点击&ldquo;快照&rdquo;后,进入快照概况,页面的快照中可以详细查看一次页面访问,概况中显示该访问页面的一些信息与资源加载详情。</p> <p><img src="https://obs-cn-shanghai.yun.pingan.com/pcp-portal/20183110104550-1063e27d91e9.png" style="height:355px; width:576px" /></p> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 点击&ldquo;资源&rdquo;后,展示该次缓慢请求的页面资源加载详情。</p> <p><img src="https://obs-cn-shanghai.yun.pingan.com/pcp-portal/20183110104558-1f448d5f960b.png" style="height:325px; width:554px" /></p> <p><a name="_Toc528595113">AJAX</a>分析</p> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; AJAX分析模块中主要内容为AJAX请求的性能概况、快照列表以及快照概况。AJAX请求性能概况主要是一个AJAX请求的总结,快照概况为某个AJAX请求一次的快照总结,快照详情为慢的AJAX请求性能详细。</p> <p>&nbsp;</p> <p><a name="_Toc528595114">关键元素</a></p> <p>&nbsp; &nbsp; &nbsp; 关键元素模块,可以对关键业务接口进行独立监控。您可以将关键业务添加到该模块,查看总体性能或是慢的性能快照。</p> <ul> </ul> <p>&nbsp; &nbsp; &nbsp; 1. 添加关键元素</p> <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 您可以在应用设置中添加、管理关键元素,点击&ldquo;添加&rdquo;按键进行添加。</p> <p>匹配模式分为三种:完全匹配、通配符和正则表达式。</p> <p><img src="https://obs-cn-shanghai.yun.pingan.com/pcp-portal/20183110104618-188043759c99.png" style="height:261px; width:525px" /></p> <p>&nbsp; &nbsp; &nbsp; &nbsp; 2. 分析关键元素</p> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 查看关键元素中出现性能问题,单次访问采集到快照的关键元素从慢请求列表中可以进行查看,①可以检索某个关键元素,②为关键元素列表。</p> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 关键元素中慢请求快照详情,当关键元素中请求符合快照捕捉规则时,快照被采集。您可以通过快照中获取信息,排查问题。</p> <ul> <li>&nbsp; &nbsp; &nbsp;基础信息:您可以通过基础信息知道该请求属于哪个关键元素,具体的请求URL,以及请求捕捉快照的时间。</li> <li>&nbsp; &nbsp; &nbsp;指标详情:该请求的重要指标数据,通过指标可以发现拖累环节。</li> <li>&nbsp; &nbsp; &nbsp;详细信息:该次请求用户访问的详细信息,通过信息排查具体问题。</li> </ul> <p><a name="_Toc528595115">性能统计</a></p> <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 浏览器Web应用使用的真实用户遍布世界各地,用户使用环境千差万别。Browser平台通过地域、域名、浏览器、运营商和操作系统五个维度,客户端类型:全部、移动端、微信端、PC端,以及性能指标的切换:整体性能、页面渲染等页面性能重要指标深层分析浏览器页面的性能瓶颈,追踪受损页面。</p> <ul> <li>地域维度</li> </ul> <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 地域维度具体分为国家、省份两级。在地域的维度下,同时可以切换指标查看地域的性能分布以及各项指标的性能趋势图。</p> <p><img src="https://obs-cn-shanghai.yun.pingan.com/pcp-portal/20183110104641-10f1d2f7969e.png" style="height:273px; width:553px" /></p> <p>页面功能如下:</p> <p>①&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 维度筛选:地域、域名、浏览器、运营商和操作系统五个维度切换选择。</p> <p>②&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 客户端筛选项:全部、移动端、微信端、PC端的筛选。</p> <p>③&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 按性能排序或按吞吐率排序</p> <p>④&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 指标选择:切换选择页面性能重要指标,如整体性能、页面渲染等</p> <p>⑤&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 页面分析按键:通过维度、客户端、指标等筛选项筛选出受损页面,点击&ldquo;页面分析&rdquo;按钮进入受损分析页面,深层剖析页面性能瓶颈。受损页面如图4-28所示。</p> <p>⑥&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 图表切换:地域性能可以从地图上查看,同时也可以切换成表格进行查看。点击表格中的国家或省份可以进行筛选,页面如图4-27所示。</p> <p>⑦&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 地图:地图分为两层,第一层为国家,第二层为省份。地图用颜色的深浅表示各地区的性能指标差异(颜色越深表示性能指标越差,相反,颜色越浅表示性能指标越好,灰色表示该地区没有用户访问数据)。</p> <p>⑧&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 下载:点击&ldquo;下载&rdquo;按键,可以将地图和地域列表下载到本地,您可以到本地进行查看。</p> <p>⑨&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Apdex性能分布:Apdex分布图与趋势图为您选择的地域、指标、客户端等条件筛选出的页面平均性能分布。根据您筛选条件的变化,Apdex分布趋势图也会跟着改变。</p> <p>⑩&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 设备类型访问量趋势:根据您选择的设备访问类型,显示出访问量随时间的变化趋势。</p> <p>⑪&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 性能分解堆叠图:根据您选择的性能指标,平台将该指标拆分为几个过程指标,方便用户排查拖累环节。</p> <p>⑫&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; TOP5性能趋势:通过您选择的地域以及性能指标,用时间趋势图表示该指标性能最差的五个地域,图中每根曲线代表一个地域。</p> <p>⑬&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; TOP5 PV趋势:选择时间范围内排出访问量前五的地域,如果选择的为二级地域,趋势图中只有选中的地域趋势。</p> <p><img src="https://obs-cn-shanghai.yun.pingan.com/pcp-portal/20183110104653-13cb45d79980.png" style="height:282px; width:576px" /></p> <ul> <li>域名维度</li> </ul> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;在域名的维度下,可以切换指标查看域名的性能分布以及各项指标的性能趋势图。</p> <ul> <li>浏览器维度</li> </ul> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;浏览器维度具体分为浏览器、版本两级。在浏览器的维度下,可以切换指标查看浏览器的性能分布以及各项指标的性能趋势图。</p> <ul> <li>运营商维度</li> </ul> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;运营商维度具体分为运营商、地域运营商两级。在运营商的维度下,可以切换指标查看运营商的性能分布以及各项指标的性能趋势图。</p> <ul> <li>操作系统维度</li> </ul> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;具体分为操作系统、操作系统版本两级。在操作系统的维度下,可以切换指标查看操作系统的性能分布以及各项指标的性能趋势图。</p> <p>&nbsp;</p> <p><a name="_Toc528595116">错误分析</a></p> <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Web应用中经常出现Javascript错误和AJAX错误,由于错误原因导致业务受损问题可以通过错误分析模块解决。Browser平台采集用户端脚本错误详情,通过查看错误堆栈信息、响应头等分析错误原因,分析受损页面。</p> <ul> <li>JS错误</li> </ul> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;JS模块可以通过错误类型、浏览器版本、页面等维度排查受影响页面,解决页面错误问题。</p> <ul> <li>AJAX错误</li> </ul> <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;AJAX错误模块可以通过错误类型、浏览器版本、页面等维度排查受影响页面,解决页面错误问题。</p> <p>&nbsp;</p>
以上内容是否解决了您的问题?
请补全提交信息!
咨询·建议

电话咨询 - 7x24 小时

400-151-8800

邮件咨询

cloud@pingan.com

在线客服

7x24 小时,急速解答

工单支持

解决云产品相关技术问题