WEB前端性能分析--工具篇
作者:网络转载 发布时间:[ 2013/9/27 15:50:47 ] 推荐标签:
在线网站类:
WebPageTest
说明:
在线的站点性能评测网站,地址http://www.webpagetest.org/
补充:
其实这网站也是个开源项目,所以支持自己搭建一个内部的测试站点
ShowSlow
说明:
showslow是yslow的数据收集与展示平台http://www.showslow.com/,它是一个开源的php项目,可以用来与firefox的yslow插件、page speed插件或者dynatrace通信,收集插件或程序所发送过来的信息并集中展示。只需要在dynatrace安装目录下进行一些设置,即可自动实现上传结果到showslow平台作为存档、分析及监控。
浏览器插件类:
FireBug
这个不用说了,它可以对页面进行调试,可以记录所有网页的访问耗时,下载的资源等。
Page Speed
说明:
基于firebug的web页面优化的评测工具,同时还有支持chrome的插件,因为是google产的。
使用:
直接打开FF的firebug或chrome的开发人员工具,切换到page speed标签,浏览一个网页然后点击分析即可,分析完成后会针对规则打出一个成绩,并告诉你哪些规则你没有符合。
其评分规则27条规则:
https://developers.google.com/speed/docs/best-practices/rules_intro
对几个网站的分析结果如下:
Google.cn 99分
Baidu.com 98分
360buy.com 98分
Taobao.com 89分
Dangdang.com 83分
补充:
其实这个更像是代码的白盒测试分析工具,因为其都是根据一定的规范来检测网页的优化程度,而不是实际的去监听和过滤页面访问所花费的时间。当然一个网页的加载时间和很多因素有关;比如网速,比如页面上的内容,不同的网站加载时间肯定是不一样的,这个每一个用一个规则来确定一个怎么的网站应该要多长的加载时间了,因此这只是一个佳实践规则和建议的检测工具;还有一点是如果想看页面访问时间的细节,firebug和chrome的开发人员工具本身已经有了。
Speed Tracer
说明:
基于chrome的插件,同样是有google产的,这个是web前端页的性能记录和分析工具,同时还提供一个规则和建议的评测。
使用:
https://developers.google.com/web-toolkit/speedtracer/get-started
补充:
这个工具收集的东西主要是资源或事件消耗的时间,它会实时的记录某个页面的加载过程,并且一直跟踪所有的事件;在易用性方面数据可以到出来,还有可以根据时间轴来分析具体某端的性能规则和建议。
Yslow
说明:
基于firebug的评测分析工具,yahoo产;和page speed类似工具,会给出页面的评分和优化说规则,同时会提供页面下载资源的统计分析功能,还提供了一些小工具,如js运行检测,图片的优化工具,未符合规则的资源有哪些等等。总的来说是page speed的增强版。
Yslow优化建议23条规则:
http://developer.yahoo.com/performance/rules.html
各网站的评分:
Google.cn 67分
Baidu.com 94分
360buy.com 77分
Taobao.com 70分
Dangdang.com 71分
相关推荐
更新发布
功能测试和接口测试的区别
2023/3/23 14:23:39如何写好测试用例文档
2023/3/22 16:17:39常用的选择回归测试的方式有哪些?
2022/6/14 16:14:27测试流程中需要重点把关几个过程?
2021/10/18 15:37:44性能测试的七种方法
2021/9/17 15:19:29全链路压测优化思路
2021/9/14 15:42:25性能测试流程浅谈
2021/5/28 17:25:47常见的APP性能测试指标
2021/5/8 17:01:11