Yslow 这个工具相信无论是搞前端的攻城师或者是搞网站的站长都了解,Yslow 可比谷歌的PageSpeed 有名多了;那个百分制下的评分数据总让国人着迷,看来应试教育造的孽太深了。Jeff 认为的话,Yslow 比较专业,但是因为是英文的,所以在个人分析结果上对某些人比较吃力,建议先使用PageSpeed Insights熟悉熟悉。

网站性能评分工具Yslow 简介

YSlow (解析为 why slow)是雅虎基于网站优化规则推出的工具,帮助你分析并优化网站性能。雅虎网站优化规则在十几个方面给你的网站提出优化建议,包括尽可能的减少 HTTP 的请求数 、使用 Gzip 压缩、将 CSS 样式放在页面的上方、将脚本移动到底部、减少 DNS 查询等十几条规则,YSlow 会根据这些规则分析你的网站,并给出评级。

官方网站:http://developer.yahoo.com/yslow/

Chrome扩展:点击安装

Firefox插件:点击安装

本文主要介绍的是Yslow 的 Chrome 扩展。

网站性能评分工具Yslow使用过程

安装好Yslow 的 Chrome 扩展后,在浏览器右上角会有个图标。先访问你要分析的网站,然后点击就可以分析了。

Rulesets 可以选择不同的评分标准,小博客自然是Small sites or blog。

网站性能评分工具Yslow组件分析

Yslow分析结果得分界面(Grade)

如上图,有 ALL (15),FILTER BY:CONTENT (5),CSS (5),IMAGES (2),JAVASCRIPT (3),SERVER (2)。意思就是说一共是15条评分规则,其中内容5条,css5条,图像2条,js三条,服务器2条。

  • 左侧列表处是详细的检测规则,评分从A-F几个级别;

点击每个规则如果有降低得分的地方,在右侧会有提示,并给出yahoo的建议。点击read more 链接会得到关于这个评分更详细的介绍。

组建视图界面(Components)

这个视图窗口主要列出了页面文档,图片,css,css中的图像,js,favicon图像的大小,以及启用gzip压缩后大小,接收与发送 cookie的大小,点击放大镜可以查看请求头信息,url是地址,expires是缓存是否存在,以及过期时间。response time是该文件响应的时间,单位是毫秒ms。后面是否启用etag,Action,yslow给出的建议部分,可以进行怎样的优化操作。比如我的背景图 的话,它会给出压缩建议,并能提供一个压缩后的图片。

统计信息视图(Statistics)

这个页面比较简单,主要是圆形分析图。其中上面有这么一句话“The page has a total of 26 components and a total weight of 515.3K bytes” ,大概意思是一共有 26 个请求,加载515.3kb的页面大小,反正八九不离十。

从上面的分析来看,本站首页的页面有点过大,最好在300kb以下。关于浏览器缓存,之所以不启用,是因为常常需要修改代码,嫌麻烦。

网站性能评分工具Yslow 使用教程的更多相关文章

  1. YSLOW(一款实用的网站性能检测工具)

     概述 YSlow是Yahoo发布的一款基于FireFox的插件,这个插件可以分析网站的页面,并告诉你为了提高网站性能,如何基于某些规则而进行优化.  安装  官网:http://yslow.org/ ...

  2. Yslow网站性能优化工具

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

  3. Google 开发的、最好用、功能最强大的网页测速与网站性能分析工具

    https://www.webpagetest.org/细致到每一个资源的加载都是完全可视化,包含详细的数据分析.开发完成自己的网站后一定要进行一下测试,你会发现还有很多可以优化的点.

  4. 网站性能工具Yslow的使用方法

    Yslow是雅虎开发的基于网页性能分析浏览器插件,从年初我使用了YSlow后,改变了博客模板大量冗余代码,不仅提升了网页的打开速度,这款插件还帮助我分析了不少其他网站的代码,之前我还特意写了提高网站速 ...

  5. asp.net网站性能优化2则

    摘要:Web服务器的性能优化有很多资料介绍了,多台主机负载均衡,查询结果的多级缓 存,数据库索引优化等都是常见的优化手段.随着后端优化空间越来越小,现在越来越多 的网站更注重前端性能的优化,就是浏览器 ...

  6. 谷歌性能测评工具lighthouse使用

    1.谷歌插件lighthouse的基本介绍 Lighthouse 是一个网站性能测评工具, 它是 Google Chrome 推出的一个开源自动化工具,能够对 PWA 和网页多方面的效果指标进行评测, ...

  7. Web性能优化工具WebPageTest(一)——总览与配置

    网站性能优化工具大致分为两类:综合类和RUM类(实时监控用户类),WebPageTest属于综合类. WebPageTest通过布置一些特定的场景进行测试,例如不同的网速.浏览器.位置等. 测试完成后 ...

  8. Nibbler – 免费的网站测试和指标评分工具

    Nibbler 是一款免费的工具,用于测试网站的各个方面指标.输入任意网站的地址,Nibbler 会给你一份报告,列出网站的10个关键领域的分数,包括可访问性,用户体验,搜索引擎优化,社交媒体和技术等 ...

  9. 【搬运工】之YSlow安装教程

    YSlow安装教程(我只是搬运工,推荐好用的地址) 地址: https://devework.com/yslow.html YSlow (解析为 why slow)是雅虎基于网站优化规则推出的工具,帮 ...

随机推荐

  1. 用Path来绘制一些图形

    Path是android中用来封装几何学路径的一个类,因为Path在图形绘制上占的比重还是相当大的.你可以用它来绘制各种样式的几何图形,做图表什么的都可以. 一.画线段 1.1 lineT(float ...

  2. 在Android开发中使用Ant 二:进行一次完整的打包

    一次完整的Android打包要进行以下的几步:编译.代码混淆.打包apk.签名apk.apk优化. 为了能包涵使用NDK的情况,在这里使用一个有native代码的工程TestJni. 在工程根目录下新 ...

  3. Java从零开始学四十四(多线程)

    一.进程与线程 1.1.进程 进程是应用程序的执行实例. 进程是程序的一次动态执行过程,它经历了从代码加载.执行到执行完毕的一个完整过程,这个过程也是进程本身从产生.发展到最终消亡的过程 特征: 动态 ...

  4. iOS之UI--CAGradientLayer

    1.CAGradientLayer 简介 如果说CAShapeLayer是用于提供设置形状的,那么CAGradientLayer是用于提供设置颜色的 英语单词:Gradient:梯度,渐变 那么Gra ...

  5. Remoting和Webservice的区别

    其实现的原理并没有本质的区别,在应用开发层面上有以下区别:1.Remoting可以灵活的定义其所基于的协议,如果定义为HTTP,则与Web Service就没有什么区别了,一般都喜欢定义为TCP,这样 ...

  6. Linux Shell 06 数学运算

    1.let let "var+=1" let v2= echo $var,$v2 #2,4 a.只支持整数运算 b.基本支持所有运算符(包括++,——,**) c.表达式中使用变量 ...

  7. IE11的API变化

    IE11已经登录Win8.1,它的API有了很大变更 一.User-agent字符串的更改 IE10的是 Mozilla/5.0 (compatible; MSIE 10.0; Windows NT ...

  8. jQuery 获取页面元素的属性值

    获取浏览器显示区域(可视区域)的高度 :    $(window).height();    获取浏览器显示区域(可视区域)的宽度 : $(window).width();    获取页面的文档高度 ...

  9. PHP通过串口发短信

    随技术进步,短信收发领域按时间先后产生了三种模式:BLOCK MODE,基于AT指令的TEXT MODE,基于AT指令的PDU MODE.其中,TEXT MODE比较简单,多款诺基亚手机均支持此款模式 ...

  10. Web安全--XSS现代WAF规则探测及绕过技术

    XSS现代WAF规则探测及绕过技术初始测试 1.使用无害的payload,类似<b>,<i>,<u>观察响应,判断应用程序是否被HTML编码,是否标签被过滤,是否过 ...