WEB前端性能分析--工具篇

发表于:2013-9-27 11:32

字体: | 上一篇 | 下一篇 | 我要投稿

 作者:hualusiyu    来源:51Testing软件测试网采编

分享:
  在线网站类:
  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分
21/212>
《2023软件测试行业现状调查报告》独家发布~

关注51Testing

联系我们

快捷面板 站点地图 联系我们 广告服务 关于我们 站长统计 发展历程

法律顾问:上海兰迪律师事务所 项棋律师
版权所有 上海博为峰软件技术股份有限公司 Copyright©51testing.com 2003-2024
投诉及意见反馈:webmaster@51testing.com; 业务联系:service@51testing.com 021-64471599-8017

沪ICP备05003035号

沪公网安备 31010102002173号