在前端开发中,常常需要评估页面内容大小,请求数量,以及JS,CSS,图片等各类型文件所占的大小,以及有没有可优化的空间。那么YSlow是您必不可少的选择。
YSlow简介:
YSlow是由Yahoo开发者团队发布的一款评估网站页面性能的工具,主要支持火狐(firefox)浏览器、谷歌(chrome)浏览器、欧朋(opera)浏览器和移动版。如下图:
主页地址:http://developer.yahoo.com/yslow/该网页也明确了网站优化的24条军规。
下面以FireFox为例和淘宝网为例做简单说明,:
1. 安装:在FireFox中点工具----》附加组件---》在搜索框中输入YSlow,点搜索即可,找到组件后点击安装,然后重启浏览器。
2. 启动:按F12在FireBug选项卡最右面有一项YSlow,切换到该项即可,或者在浏览器右下角,单击YSlow图标启动即可。
3. Grade (等级视图),这里提供了F-A 五个等级,A级说明最好,F最差,也就是说可优化的空间更大。如下图所示:
4.Components(组件视图),该视图描述各个元素占用的空间大小如下图所示
5. Statistics(统计信息视图) ,本视图以图形化的形式描述相关类型文件的统计大小等
6. Tools(附助工具视图),本视图描述了YSlow提供的相关工具,可以更深入的对网站引用的JS,CSS等进行具体分析
网站性能最佳体验的34条黄金守则:
http://www.dudo.org/article.asp?id=214内容篇
http://www.dudo.org/article.asp?id=215服务器篇
http://www.dudo.org/article.asp?id=216JavaScript和CSS
http://www.dudo.org/article.asp?id=218图片、Coockie与移动应用
延伸阅读:http://www.cnblogs.com/yslow
分享到:
相关推荐
[优]Yslow网站前端性能测试工具安装与使用简介
yslow对前端的请求的响应时间,缓存,数据包大小,协议等进行评分,默认规则23条。
Show Slow 是个开源测试工具,帮助检测各种网站性能指标。它会把页面速度的检测结果排序,有 dynaTrace AJAX 版,WebPageTest 和 YSlow。它会用图形化显示排序结果,帮助用户理解哪些因素会影响网站的性能。 ...
雅虎公司的前端性能分析工具Yslow,有助于前端同事开发和测试人员测试前端页面规范和性能。
yahoo性能中心总结的高性能网站设计的14条规则,这个工具就是用来根据这些规则对你的网站进行测试评分的,下载后直接拖到firefox里就可以自动安装了,但是先要装另外一个插件firebug,在我上传的资源列表里可以找到
YSlow.3.1.2.crx for Chrome : yahoo性能中心总结的高性能网站设计的14条规则,这个工具就是用来根据这些规则对你的网站进行测试评分的,下载后直接拖到chrome里就可以自动安装了
用chrome浏览器,扩展程序拖拉进去即可使用,网络性能测试工具
该工具为浏览器插件,可协助web前端开发或测试,做简单性能测试
本文档较全面,包括 前端性能优化的规则、工具使用介绍等演讲稿和资料。包括YSLOW工具介绍。 帮助你进行前端性能测试
主要就是通过内存计算模拟出图形界面,没有平常所见的操作界面,分为客户端和服务器YSlow:当Firefox浏览网页时,可以分析网站的页面(基于Yahoo14条评分原则),并指出如何进行优化提高网站性能 工具介绍 Xvfb:...
长久以来,浏览器兼容性测试一直是困扰前端工程师的工作之一。虽然随着IE9的普及和IE10的发布,这项工作变的越来越轻松,但是旧版本的IE浏览器...PageSpeed和YSlow分别是Google和Yahoo推出的网站性能测试工具。2款产
每一条规则都 帮助你开发更快web页面的15个工具 软件测试 面是15个很有用的工具,能够帮助你开发更快的web工具 1.YSlowforFirebug YSlow能够评价一个网站的性能,基于Yahoo!DeveloperNetwork的...
在我们用雅虎浏览器工具Yslow时,就有这么一个优化选项,全称为:Configure entity tags (ETags),即配置实体标记,什么是Etags?ETags(Entity tags)是服务器和浏览器的一个功能,它用来判断浏览器缓存里的元素是否...
有一个比Google Page Speed更强大网页性能优化工具,那就是YSlow,它是由Yahoo提供的页面性能评测和优化工具,YSlow也有页面性能评分,有趣的 是,YSlow评分接近的两个页面,Page Speed评分却相去甚远,在实际的页面...
5)如何在不能设置IIS的情况下,最大限度的提升网站性能,让你的网站在yslow或page speed这两个工具的测试下拿高分; 6)CommunityServer中的Ajax功能,后由我对其改进完善,使其使用更加简洁; 7)如何在你的网站中...
5)如何在不能设置IIS的情况下,最大限度的提升网站性能,让你的网站在yslow或page speed这两个工具的测试下拿高分; 6)CommunityServer中的Ajax功能,后由我对其改进完善,使其使用更加简洁; 7)如何在你的网站中...
现在据我知道比较好的用来测试网页性能的工具有两个,分别为:老牌的雅虎yslow,新秀google page Speed。 怎么会突然想起谈css与性能优化呢?其实这个问题我已经想了很久了,想写,但是也不知道从何写起,今天就简单...
8.1 性能测试和调试 115 8.2 只写入DOM 116 8.3 给用户反馈的优先级是最高的 117 8.4 将它们一起使用:无限滚动 118 8.5 总结 127 8.6 项目 127 第9章 手势的基本内容 128 9.1 为什么用手势呢? ...
(Selenium和Webdriver) Grunt:您JavaScript任务运行器Bower:电力需求套餐辅助功能插件:添加了与Chrome浏览器扩展程序相同的审核库(并且还测试了AX辅助功能引擎) Yslow和Pagespeed(进行中),用于性能测试。