概述

YSlow是Yahoo发布的一款基于FireFox的插件,这个插件可以分析网站的页面,并告诉你为了提高网站性能,如何基于某些规则而进行优化。

 安装 

官网:http://yslow.org/

官方下载,点击安装,Google在扩展程序中直接拖进也可以,安装成功后会在右上角显示图标

 YSLOW有什么作用?

YSlow可以对网站的页面进行分析,并告诉你为了提高网站性能,如何基于某些规则而进行优化。
YSlow可以分析任何网站,并为每一个规则产生一个整体报告,如果页面可以进行优化,则YSlow会列出具体的修改意见。

YSlow是如何工作的?

YSlow分三个阶段来产生结果:

  1. YSlow抓取DOM来查找页面中的所有组件(图像,脚本,样式表等)。在抓取DOM之后,YSlow通过Firebug的Net Panel组件循环并将其添加到已经在DOM中找到的组件列表
  2. YSlow获取有关每个组件的信息:大小,是否为gzipped,Expires头等。如果可用,YSlow从Firebug的Net Panel获取此信息。如果组件信息在Net Panel中不可用(例如,该组件是从缓存中读取的,或者它有一个304响应),则YSlow会生成一个XMLHttpRequest来获取该组件并跟踪其标头和其他必要的信息。
  3. YSlow获取关于该页面的所有数据,并为每个规则生成一个等级,从而生成总体等级。

YSLOW使用

点击YSlow按钮,启动插件,点击Run Test 测试当前页面。在新弹出的界面中按照重要性显示了影响此页面效率的元素,其中A类评分为最高,F为最低。

Rulesets 可以选择不同的评分标准:建议对号入座

  YSlow(V2) Ruleset:包含了所有22个测试的规则

  Classic(V1) Ruleset:YSlow (V1)包含原始13规则

Small Site or Blog Ruleset:小网站或博客规则集,包含14个规则,适用于小型网站或博客

以下为等级的例子:

如果页面与某一规则无关,则线束N/A,表示不适用。

点击每一规则,都显示改进建议。

 YSLOW组件介绍

Grade(等级视图)—Yslow的第二个选项卡:Yslow给出的网站性能评分

Yslow给出的网站性能评分,从F~A,A是最好的

Components(组件视图)—Yslow的第三个选项卡:通过Components考验查看网页各个元素占用的空间大小

组件检视表:

TYPE:该组件的类型。该网页是由组成部分的下列类型: doc, js, css, flash, cssimage, image, redirect, favicon, xhr, and iframe.

SIZE(KB):该组件的大小以千字节。

GZIP(KB):该组件的gzip压缩的大小以千字节。

COOKIE RECEIVED(bytes):字节数在HTTP设置的Cookie响应头。

COOKIE SENT(bytes):节数的Cookie在HTTP请求报头

HEADERS:HTTP信息头,点击放大镜查看全面信息。

URL:链接地址

EXPIRES(Y/M/D):日期的Expires头,属于缓存设置一种。

RESPONSE TIME (ms):响应时间

ETAG:ETag响应头,也是缓存设置的一种

ACTION:额外的性能分析

Statistics(统计信息视图)—Yslow的第四个选项卡:Yslow的统计信息视图

左侧图表显示是页面元素在空缓存的加载情况,右侧为页面元素使用缓存后的页面加载情况。

从图中可以直观的看出(标的红框),这个网页14个HTTP请求,网页的大小达到443.4K

Statistics这个统计信息视图工具和Components(第三选项卡)一样,只是效果更直观,如果要获得性能优化建议还是要看Grade(第二选项卡)的详细建议。

Web性能最佳实践和规则

雅虎卓越绩效团队已经确定了34个影响网页性能的规则。YSlow的网页分析是基于这34个可测试的规则中的23个。点击下面的每个表现规则查看详细信息。

  1. 最小化HTTP请求
  2. 使用内容交付网络
  3. 避免空的src或href
  4. 添加一个Expires或一个Cache-Control Header
  5. Gzip组件
  6. 把StyleSheets放在最前面
  7. 把脚本放在底部
  8. 避免使用CSS表达式
  9. 使JavaScript和CSS外部
  10. 减少DNS查找
  11. 缩小JavaScript和CSS
  12. 避免重定向
  13. 删除重复的脚本
  14. 配置ETags
  15. 使AJAX缓存
  16. 使用GET进行AJAX请求
  17. 减少DOM元素的数量
  18. 没有404s
  19. 减小Cookie大小
  20. 为组件使用不使用Cookie的域
  21. 避免过滤器
  22. 不要在HTML中缩放图像
  23. 使favicon.ico小和缓存

对于检测结果一般90分优秀,80分以下建议考虑优化!

YSLOW(一款实用的网站性能检测工具)的更多相关文章

  1. 网站性能评分工具Yslow 使用教程

    Yslow 这个工具相信无论是搞前端的攻城师或者是搞网站的站长都了解,Yslow 可比谷歌的PageSpeed 有名多了:那个百分制下的评分数据总让国人着迷,看来应试教育造的孽太深了.Jeff 认为的 ...

  2. linux服务器性能检测工具nmon使用

    今天介绍一款linux系统服务器性能检测的工具-nmon及nmon_analyser (生成性能报告的免费工具),亲测可用. 一.介绍 nmon 工具可以帮助在一个屏幕上显示所有重要的性能优化信息,并 ...

  3. Metasploit是一款开源的安全漏洞检测工具,

    Metasploit是一款开源的安全漏洞检测工具,可以帮助安全和IT专业人士识别安全性问题,验证漏洞的缓解措施,并管理专家驱动的安全性进行评估,适合于需要核实漏洞的安全专家,同时也适合于强大进攻能力的 ...

  4. 在debug模式下引入一些性能检测工具

    我们经常在debug模式下使用一些性能检测工具,例如blockCannary,leakCannary.Stetho等,但是我们release的时候又不需要这些检测工具,通常情况下我们的做法是在buil ...

  5. LINUX下一款不错的网站压力测试工具webbench

    LINUX下一款不错的网站压力测试工具webbench 分类: Linux 2014-07-03 09:10 220人阅读 评论(0) 收藏 举报 [html] view plaincopy wget ...

  6. Sql性能检测工具:Sql server profiler和优化工具:Database Engine Tuning Advisor

    原文:Sql性能检测工具:Sql server profiler和优化工具:Database Engine Tuning Advisor 一.工具概要     数据库应用系统性能低下,需要对其进行优化 ...

  7. 好用的性能检测工具-性能监控工具- Glances

    平常我经常使用 htop 工具来进行对主机进行性能检测.但是它只能对 进行进行管理.并简要显示 进程和cpu和内存使用信息:性能监控工具: glances 是比较好的性能检测工具.相比较htop还能显 ...

  8. 推荐AndroidGodEye Android性能检测工具

    推荐AndroidGodEye Android性能检测工具 1 介绍 AndroidGodEye是一个可以在PC浏览器中实时监控Android性能数据指标的工具,你可以通过wifi/usb连接手机和p ...

  9. Yslow网站性能优化工具

    Yslow是一款网站性能优化的插件:

随机推荐

  1. 关于手机端适配的问题(rem,页面缩放)

    关于手机端适配的问题(rem,页面缩放) 96 进击的小前端 关注 2018.02.02 13:57 字数 320 阅读 19评论 0喜欢 0 相信很多和会和我碰到一样的情况,就是你用rem去写移动端 ...

  2. placeholder解决兼容各种IE浏览器的方法

    <input id="search" type="text" class="box" class="inputText&qu ...

  3. python数据结构与算法第六天【栈与队列】

    1.栈和队列的原理 栈:后进先出(LIFO),可以使用顺序表和链表实现 队列:先进先出(FIFO),可以使用顺序表和链表实现 2.栈的实现(使用顺序表实现) #!/usr/bin/env python ...

  4. Lodop部署web网站 客户端本地打印角色

    Lodop用于客户端本地打印,部署到web网站非常简单,此博文介绍的是混合部署方式,该方式兼容所有浏览器,当浏览器支持np插件的时候,使用Lodop插件方式,浏览器不支持np插件,会用C-Lodop服 ...

  5. 华硕X99-A II 安装使用 志强 XEON E5-1603 v4

    刚开始无法启动,Debug灯的数字不停的轮回变换,后来把XMP开关关闭后,就能正常启动了.如果不行,就多关机几次,一般3次以上应该就可以启动开了.之后就能正常使用了.

  6. b2b

    sku(Stock Keeping Unit)(件)最小库存量单位. spu(一款) 一种详细的规格参数有时候跟spu,规格参数加上颜色+尺寸什么的唯一确定了一个手机,对应的就是sku spu:一款产 ...

  7. environment variable

    %ALLUSERSPROFILE% C:\ProgramData %APPDATA% C:\Users\cuthead\AppData\Roaming %COMMONPROGRAMFILES% C:\ ...

  8. How to helloworld on Xcode

    create a mac app,click button to change label text? create project,click left window button on Main. ...

  9. 通过JPA注解获取某个类的主键字段

    public String getPkColumn(String className) { String pkColumn = null; try { Class clazz = Class.forN ...

  10. JMeter——JMeter如何进行汉化

    1.找到bin目录下的jmeter.properties文件 2.打开找到第37行,打开注释并将language=en改为language=zh_CN 3.重启