Yslow性能指标

来源:互联网 发布:c语言逻辑符号 编辑:程序博客网 时间:2024/06/02 03:36
YSLOW是YAHOO开发者团队发布的一款基于FIREBUG的插件。用于分析网页,并根据一些高性能网站的规则进行相应的评级打分,对于网页性能优化有很好的帮助作用,告诉你那些部分影响了你的网页速度,WHY SLOW!!
主要规则有13条,其中11条比较关键:


1.Make fewer HTTP requests--更少的http请求,也就是说页面中尽量少的引用外部静态资源,js、css以及图片


2.Use a CDN--使用CDN网络,将页面中的静态资源分布到离用户最近的网络节点上


3.Add an Expires header--为静态资源文件增加过期时间,让用户通过本地缓存来更快的访问网站


4.Gzip components--压缩静态资源内容,减少网络传输时间


5.Put CSS at the top--将CSS放在页面头部,能够更快渲染页面


6.Put JS at the bottom--将JS放在页面底部,一般情况下JS的下载是阻塞模式的,放在页面顶部会阻塞其他资源的下载


7.Avoid CSS expressions--不要使用CSS表达式,因为CSS表达式需要很多资源,有时甚至会造成页面假死


8.Make JS and CSS external--将CSS和JS使用外部的独立文件,这点有点和1冲突,但是仔细分析下,并不矛盾


9.educe DNS lookups--减少DNS查找(这点我后面详细解释下)


10.Minify JS--最小化压缩JS,和第4点不同,使用YUI Compressor或者JSMin将JS文件进行分析,将一些变量名变短,去除不必要的空格和符号


11.Avoid redirects--避免无意义的跳转


12.Remove duplicate scripts--去除重复的脚本,不光是文件,甚至是同功能的函数


13.Configure ETags--配置实体标签(要说清楚这个问题就要引申出很多情况,不做展开了)

 
先讲讲比较容易做到的几点(实现难易程度不一样,注意先后次序):
YSlow第八条:这点我相信大家比较容易理解,而且很多都已经实施,就是将CSS和JS独立成相应的文件,使用link和script标签应用;
 
YSlow第三条:因为静态资源文件(CSS\JS\IMG统称静态资源文件)往往是变化不大的,那么可以在HTTP头中增加相应的过期时间,让浏览器缓存在本地,这样当第二次使用的时候,就不会下载全部内容,只是进行状态检查;
 
YSlow第四条:也很好理解,将静态内容压缩后,减少网络传输时间;因为IIS的压缩设置相对较烦,可以使用第三方工具,如IISxpress,支持32位和64位,而且还有一个技术交流版的授权;
 
做到以上三点,网页速度已经有比较明显的加速了,还有几点虽然略微麻烦,但是也是很好的加分手段:
 
YSlow第十条:最小化JS文件,我们写的JS往往包含空格、TAB等对JS执行没用影响的字符,但是这却实实在在的增加了JS的体积,使用工具能够去除这些无用的字符,减少文件体积。但是同样带来的问题就是,JS不能有错误,另外压缩后的JS代码很难阅读,所以如何在开发时和发布时协调好就是很大的问题,为了这点我们使用不同的文件引用,在开发时(DEBUG)使用未压缩版,在发布时(RELEASE)使用压缩版,使用#if #else #endif引用不同的文件;
详细解释下YSlow的第9点,减少DNS查找。
通常情况下按照我们的理解,静态资源文件都是放在本站点目录下的。由于以前大家的网络速度都不快,IE浏览器为了防止大量的http请求阻塞了网络连接,所以同一域名下的http请求,只允许2个并发线程,所以这就导致我们看到有的页面的图片是逐步逐步显示出来的。通过Safari的网络时间线工具就能看出来。
显而易见,为了突破这个限制,我们可以增加几个域名,从而增加并发下载,加快速度。
最好的方式是自己指定每个文件的域名,按照i1、i1、i2、i2、i3、i3、i1、i1的排列方式,但是同时还要考虑引用的文件大小,进行合理的排列,这对于团队开发就过于复杂了。我们使用了i1.dpfile.com、i2.dpfile.com和i3.dpfile.com三个域名,然后在每个调用静态资源文件地方都是用函数调用:DianPing.Common.StaticFile("/s/js/g.mt.min.js"),函数会根据文件进行hash,分配一个域名,这样就能最大化的散列静态文件的域名,虽然有缺点,却是比较平衡的方式。


就在我写文章的同时,仔细分析了YSlow的评分标准,找到我们丢失的一分原因,也是因为第9点。第9点满分是100分,YSlow认为一个页面上最合理的是2个以内域名,每增加一个扣除5分,我们的页面有4个域名(www\i1\i2\i3),扣除了10分。这个占总比例的1/12,所以四舍五入,被扣除了1分。(不过我认为这1分还是值得的,页面加速很明显,而且DNS查找是可以缓存哒~~~)
从Safari的网络时间线工具上看到JS(橙色)的加载会阻塞其他资源的下载,所以我打算再独立一个域名j1.dpfile.com,专门加载JS文件。
不管怎么说,总体来说性能还是提升了不少。




YSlow第十三条:对于一般性网站来讲是鸡肋,所以纯粹为了加分。
1 0
原创粉丝点击