网站监控网页内容监测(Google、Amazon、雅虎等世界著名网站的网站性能优化)

　　网站监控网页内容监测(Google、Amazon、雅虎等世界著名网站的网站性能优化)

　　据国家统计局数据，2015年全国网络零售额38773亿元，比上年增长33.3%。阿里占比76.1%，京东占比11.9%。2016年3月4日，美国知名研究公司Forrester发布亚太电子商务数据报告指出，2015年中国电子商务市场规模正式超越美国，成为全球最大的电子商务市场。为了抢占中国市场，追求利润，跨境电商纷纷推出各种应对措施，其中电商性能优化网站是重要一环。

　　网站性能是什么？

　　用户输入域名网站，通过DNS解析，找到目标服务器的IP，请求的数据通过互联网到达目标服务器。响应数据通过互联网返回给用户的浏览器，浏览器获取结果，计算、渲染并展示给用户。这个看似复杂的过程涉及到网站可用性、准确率、打开速度、首屏时间等一系列指标。，这些数据组合起来就构成了网站性能的完整定义，而在用户眼中，很简单，就是打开网页。

　　网站业绩与互联网公司的业务和利润息息相关。根据谷歌、亚马逊、雅虎等世界著名网站的网站性能统计，谷歌网站每400毫秒访问速度减慢一次，将导致访问速度下降用户搜索请求0.59 %；亚马逊表示，增加 100 毫秒的 网站 延迟将导致其收入下降 1%，而雅虎 网站 的 400 毫秒延迟将导致流量下降 5-9%。

　　有鉴于此，经过业内反复比较，某知名跨境电商最终选择了云智慧监控宝服务，但初期客户需求相对一般。通过与客户的反复沟通，结合客户目前的业务发展状况和网站架构，确定的监控方案如下：

　　1.监控网站通过监控宝，利用云端智能部署在全球约220个监控点，监控其电商的可用性网站，客户自定义报警阈值，< @网站如果阈值是在运行时触发的，要求能够及时告警；

　　2.监控监控宝的API，监控其微信公众号API的业务流程，客户自定义报警阈值，网站如果阈值在运行时触发，则要求能够及时报警；

　　3.准确的采集网站通过监控监控宝的性能，从全球不同地区的用户中获取打开速度、首屏时间等用户体验数据；

　　4.通过监控宝对比监控同行业4家家电零售商网站；

　　5.通过网站监控、API监控、网页性能监控、行业数据对比，找出网站性能问题及其根源，并提供解决方案和优化建议。

　　监控计划确定后，将开始对网站的正式监控。为保证数据相对客观准确，采用一周的数据进行分析。

　　一、网站可用性：

　　图1 Web监控结果

　　图2 移动Web监控结果

　　电商行业平均可用率为99.99%，但该客户在中国大陆的平均可用率仅为95%（有效监控次数为3847)，安徽仅为89.13%（有效监测数为82)，北京为90.27%（有效监测数为167)； Mobile Web 平均可用率为 96%（有效监控次数为 3805)，北京仅为 88.59%（有效监控次数为 163)，可用率为最坏的。

　　可用率之所以低于电商行业平均值，主要是由于网站访问过程中出现了不同程度的错误。我们以错误最多的常州地区（错误数27)为例，对错误类型进行统计：

　　图 3 Web 错误类型

　　图 4 移动 Web 错误类型

　　从图3和图4可以看出，网站错误类型主要有403 Forbidden、首屏渲染超时（648)和网页元素加载错误（649)等） . 移动端错误次数为103次 与官网不同的是新的错误类型文档下载超时（647)、TCP连接建立失败（602)和服务器连接中断） （604) 等）。

　　通过历史快照跟踪（通过云智慧透视获取的部分数据），403 Forbidden（403)错误）是客户网站平均可用性低的主要原因。其主机主要分布在常州电信、佛山电信、天津联通、西安电信、新乡电信、太原联通等。客户的CDN服务商经常拒绝服务响应服务器的两个IP地址，客户联系 CDN 服务商解决问题。

　　其次，HTTP/1.1503服务不可用也是一种值得客户关注的错误。错误主机主要分布区域有：南昌电信、天津电信、武汉电信、郑州联通、徐州电信、佛山电信、镇江电信、上海电信等。分析原因，主要是请求是动态的，回源站，Jetty处理的请求太多，导致服务不可用。建议客户为此请求按频率生成静态页面。

　　最后对客户官网的元素加载错误进行分析，发现部分资源出现401、404、首屏渲染超时（648)）等错误。其中，648错误主要是因为Downloading时间过长。首屏时间按元素在首屏可见区域正常渲染所用时间计算；首屏时间直接关系到元素下载速度。当元素下载时间超时时，必然会导致首屏时间。若超过超时时间，后续章节将统一提供页面优化建议。

　　二、业务流程监控：

　　传统的 IT 监控以技术为基础，重点关注 IT 基础设施的可用性。然而，业务系统故障并不仅仅由IT故障引起，简单的IT监控往往无法满足企业的业务需求。业务流程监控是云智能针对企业业务视角推出的特色功能。它通过应用接口调用模拟用户的使用过程，以可量化、可视化、自动化的技术手段衡量业务系统服务的响应性能，准确感知终端用户的体验和业务的整体质量。针对该跨境电商客户的业务状况，提出了几种监控流程。我们以最常用的购物流程为例：

　　1.登录，获取token；

　　2.将得到的token用MD5算法重新加密，生成新的字符串；

　　3.购物，将新字符串作为头参数传入；

　　4.退出

　　创建API监控任务，获取登录后生成的token信息并存储在created token变量中；然后用MD5重新加密变量值，生成一个新的字符串；并将其作为头参数传递给下一个接口。

　　监控过程中有一个问题，就是按照客户的指令进行配置，获取token并加密，但是访问购物API接口一直不成功，但是Postman可以顺利通过测试。经过检查对比，发现登录成功后的响应头中收录了对应的cookie值，于是重新修改监控任务，将获取到的cookie赋值给一个预定义的变量，然后作为Set-购物API接口请求头的cookie 值再次测试，成功通过。

　　三、网页性能和用户体验

　　1. 首屏时间

　　首屏时间是网站用户体验的重要指标。一般一个网站，如果首屏时间小于2秒就比较好，小于5秒可以接受，大于5秒就不能忍受了。用户将选择刷新页面或立即离开。

　　图 5 网站 在第一个屏幕上花费的时间

　　上图中，绿色表示上折时间小于3.5s；*敏*感*词*表示上折时间小于7s；红色表示上折时间大于7s。除了山西小于3.5s外，这个网站的上折时间大于3.5s，青海、陕西等部分地区甚至更大超过 7s。网站速度很慢，用户体验很差。需要部署CDN来提高各地的访问速度。

　　2.行业比较

　　图6 客户与同行业页面性能对比网站

　　横坐标为基础文档下载的字节数，即页面基础文档元素的大小，单位为KB；纵坐标是使用第一个屏幕时，以s为单位；以上两种数值都是数值越大，网站速度越慢，用户体验越差。小球的体积代表页面开始浏览到收到最后一个数据包的时间差。数据越大，页面的整体性能越差。黑色代表我们的客户，其他三种颜色代表同行业的另外三个客户。

　　为什么客户的基本文档元素最小，但首屏时间和响应时间最大，用户体验最差？

　　3.原因分析

　　通过对这些网站进一步分析，有以下几个因素：

　　(1)代码级别

　　我们客户端的首页收录的代码行数太多，JS太多，不同域名的请求太多，有的JS是未压缩的，有的没用的JS是页面性能差，用户体验差的重要因素。

　　同时通过查看四家网站公司的代码发现，在客户的页面中，JS内外兼备，并被放置在页面的上中部，也就是另一个导致第一个屏幕加载缓慢的重要因素。. 因为浏览器在执行 JavaScript 代码时不能同时做其他事情。这是