前端性能分析工具---阿里测介绍

（如下以分析博客园网站为例www.cnblogs.com）

阿里测：

http://www.alibench.com

首页：

1、性能打分

a)         首字节时间

指标解释：浏览器开始收到服务器响应数据的时间(后台处理时间+重定向时间)
评估方法：达标时间=DNS解析时间+建立链接时间+SSL认证时间+100ms. 比达标时间每慢10ms减1分.

b)         使用长链接（keep alive）

指标解释： 服务器开启长链接后针对同一域名的多个页面元素将会复用同一下载链接(socket)
评估方法：服务器是否返回了"Connection: keep-alive"HTTP响应头,或者浏览器经过同一链接下载了多个对象

c)         开启GZIP压缩

指标解释：仅检查文本类型("text/*","*javascript*")
评估方法：服务器是否返回了"Transfer-encoding: gzip"响应头。假如所有压缩就是满分，不然:得分=满分x(100%-所有gzip后节省的比例%)

d)         图片压缩

评估方法：
对于GIF - 略过
对于PNG - 必须是8位或更低
对于JPEG - 对比使用photoshop质量选择50后的图片,尺寸超出10%之内及格,10%-50%警告,50%以上不达标
得分=满分x(100%-图片从新压缩后能够节省的比例%)

e)         设置静态内容缓存时间

指标解释：css,js,图片资源都应该明确的指定一个缓存时间
评估标准：若是有静态文件的过时时间设置小于30天，将会获得警告

f)          合并css和js文件

指标解释：合并js和css文件能够减小链接数
评估方法：每多一个css文件减5分，每多一个js文件减10分

g)         压缩JS

指标解释：除了开启gzip,使用js压缩工具能够进行代码级的压缩
评估方法：js文件会经过jsmin压缩.若是原始文件gzip过,jsmin处理过的文件也会gzip后再进行对比.若是能节省>5KB或者%10的尺寸,评估失败.若是能节省>1KB一样会收到警告.

h)         合理使用cookie

指标解释：cookie越小越好,并且对于静态文件须要避免设置cookie
评估方法：只要对静态文件域设置了cookie，评估失败. 对于其余请求，cookie尺寸过大会获得警告.

2、详情分析

i)           首次探测（首次探测会清空DNS缓存和浏览器缓存），重复探测（保留首次探测的缓存，进行再次探测）。

j)           页面加载时间：从页面开始加载到页面onload事件触发的时间。

k)         首字节时间：从开始加载到收到服务器返回数据的第一字节的时间。

l)           开始渲染时间：从开始加载到浏览器开始渲染第一个html元素的时间。

m)       Speed index：

n)         元素个数：页面中包含的全部DOM节点个数

o)         页面加载（包括加载时间，请求数，下载总计）：从页面开始加载到onload事件触发这个时间段内的统计数据，通常来讲onload触发表明着直接经过HTML引用的CSS，JS，图片资源已经彻底加载完毕。

p)         彻底加载：随着ajax应用的流行，不少资源都会经过JS脚步异步加载，因此onload事件并不意味着彻底加载，onload以后js可能依然在异步加载资源。彻底加载的定义是：页面onload后2秒内再也不有网络请求时刻。

q)         元素瀑布图：经过元素瀑布图能够很直观获得如下信息。

                         i.              资源的加载顺序。

                       ii.              每一个资源的排队延迟，加载过程。

                      iii.              加载过程当中CPU和贷款的变化曲线。

                      iv.              统计出出错请求、大图片请求、onload以后的请求、开始渲染以前的请求、首字节较慢的请求及DNS解析较慢的请求个数。

r)          链接视图展示了页面加载过程当中建立的（keep-alive）链接，以及经过每一个链接所加载的资源。

3、元素分布

s)         资源类型统计：css，html，image，js，other（请求数，大小）

t)          资源域名统计：请求域名个数及次数

4、视图分析

将整个网页生成的过程以胶片视图、视频、截屏的形式展示出来，并提供详细的状态栏加载日志。