`

把YSlow添加到Build Pipeline中

阅读更多
YSlow
Yslow是雅虎开发的网页性能分析工具,Yahoo!的性能团队经过多年研究识别出了34条会影响Web应用性能的行为,然后根据其中可测试的23项行为开发了YSlow工具
  • Minimize HTTP Requests
  • Use a Content Delivery Network
  • Avoid empty src or href
  • Add an Expires or a Cache-Control Header
  • Gzip Components
  • Put StyleSheets at the Top
  • Put Scripts at the Bottom
  • Avoid CSS Expressions
  • Make JavaScript and CSS External
  • Reduce DNS Lookups
  • Minify JavaScript and CSS
  • Avoid Redirects
  • Remove Duplicate Scripts
  • Configure ETags
  • Make AJAX Cacheable
  • Use GET for AJAX Requests
  • Reduce the Number of DOM Elements
  • No 404s
  • Reduce Cookie Size
  • Use Cookie-Free Domains for Components
  • Avoid Filters
  • Do Not Scale Images in HTML
  • Make favicon.ico Small and Cacheable

YSlow会根据这些行为检测Web应用,对应用的性能的打分,并对如何进行性能改进提出建议。目前大部分的浏览器(Chrome,Firefox,Safari,Opera,没有IE)都已支持其插件。官网:http://yslow.org/


YSlow命令行运行
大部分的情况下,开发者都是使用浏览器的YSlow插件调试页面性能,然后根据建议修改提升应用性能,根据极限编程的思想,我们做过的一件事如果是好的,那么我们就应该更经常的去做,逼近极限的去做。因此,最好能够做到每一次提交都能够运行一次Yslow,检测最新提交的代码是否有前端性能问题,这也是“把性能测试作为一等公民”的思想的具体实施。因此,最好是能把Yslow直接添加Build Pipeline中。

要把Yslow添加到build pipeline中,首先需要能够在命令行中运行YSlow,这方面YSlow提供了2个选择:
  • YSlow for PhantomJS
  • 为应用生成HAR文件,然后使用YSlow的NPM包分析这个文件
比较了一下,生成HAR文件比安装PhantomJS麻烦,因此,我个人更倾向于使用PhantomJS。

使用YSlow for PhantomJS非常简单:

首先,需要安装PhantomJS,具体可以参见PhantomJS官网:http://phantomjs.org/download.html

然后,下载YSlow for PhantomJS脚本(http://yslow.org/yslow-phantomjs-3.1.8.zip )

再然后,运行 phantomjs yslow.js http://www.example.com 即可得到YSlow结果。

该工具提供了很多的参数让开发者更容易定制自己想要的YSlow结果,比方说输出文件的格式,对性能的最低要求之类的。开发者可以通过命令 ‘phantomjs yslow.js --help’查看。

Yslow和CI服务器集成
有了命令行支持,与CI服务器的集成就不是什么问题了。尤其是开源的Jenkins服务器,在Jenkins中,点击“Add build step”添加测试步骤,选择“Execute shell”选项,只需要把如下的命令添加到构建过程就行了:
phantomjs yslow.js -i grade -threshold "B" -f junit http://www.example.com > yslow.xml

上面的命令行的意思是:
  • -i grade 表示需要展示所有的信息
  • -threshold "B" 表示总得分不能低于B
  • -f junit 表示结果输出采用Junit的格式
  • http://www.example.com 表示需要测试的页面
  • >yslow.xml 表示结果的输出文件

运行完上面的命令之后,还需要点击Add post-build action”添加一个新的步骤,选择“publish Junit test result report”,把测试报告展示在Jenkins中。运行后就可以在测试结果中看到如下的结果:

除了Jenkins之外,ThoughtWorks Go, Travis-CI等也可以很好的与Yslow配合。
  • 大小: 34 KB
  • 大小: 134.9 KB
1
0
分享到:
评论

相关推荐

    yslow前端性能测试工具

    yslow有浏览器插件版本,支持Firefox、Chrome和Safari,也有命令行工具,适合集成到自动化测试和构建流程中。使用时,只需在浏览器中打开yslow插件,输入要测试的网页URL,工具就会自动分析并显示结果。 **总结** ...

    yslow-3.1.0-fx

    在本文中,我们将深入探讨yslow的功能、工作原理以及如何在Firefox中安装和使用它。 首先,yslow的核心功能在于网页性能分析。它遵循了Yahoo!的“YSlow”规则,这套规则是基于23条最佳实践,旨在优化网页的加载速度...

    YSlow使用指南最新2

    通过详细的等级视图、组件视图和统计信息视图,开发者可以清楚地了解到哪些方面需要优化,并根据YSlow提供的建议进行相应的调整。此外,YSlow还提供了灵活的规则集管理和多种实用工具,使得优化工作更加高效。对于...

    yslow-3.1.8-fx最新版.rar

    YSLOW和Firebug,这两个工具在Web开发和优化领域中堪称经典组合,尤其对于Firefox浏览器用户来说,它们是提升网页性能不可或缺的工具。yslow-3.1.8-fx最新版.rar这个压缩包文件为我们提供了YSLOW的最新版本和适用于...

    yslow for firefox

    yslow for firefox v18

    使用YSlow工具提高网页的效率

    安装完成后,在Firefox的【工具】菜单中找到并打开Firebug,然后在Firebug中选择YSlow菜单,就能启动YSlow的主界面。 YSlow的主要功能在于网页性能评估。通过点击【Performance】菜单,它会根据一系列预设的网页...

    yslow3_1_2

    使用YSlow时,它会在浏览器中显示一个侧边栏,列出当前页面的各个组件,以及每个组件的加载时间和评分。用户可以点击每个组件查看详细信息,并获取改善性能的具体建议。此外,YSlow还提供了详细的报告,包括整体性能...

    YSlow 2.0.0b6

    YSlow 2.0.0b6是针对Firefox浏览器的一个扩展插件,适用于Firefox 2.0到3.5.*版本,旨在帮助用户提高网页加载速度,提升浏览体验。 一、YSlow的工作原理与核心功能 YSlow遵循Yahoo!的网页性能最佳实践,这套实践由...

    yslow-3.1.8-fx.xpi

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

    [优]Yslow网站前端性能测试工具安装与使用简介

    Yslow是一款基于Firefox浏览器的扩展程序,它可以集成到Firebug中使用。它通过分析网页的各项性能指标来评估网页的加载时间,并提供一系列改进性能的建议。Yslow主要依据雅虎提出的前端性能优化原则来对网页进行评分...

    yslow-3.0.9

    网站性能工具Yslow

    yslow-1.0.2-fx

    yslow,用于检测网站性能,帮助开发人员进行性能调优的优秀工具

    firebug+YSlow

    5. **与Firebug集成**:YSlow可以无缝集成到Firebug中,提供更全面的Web性能分析。 **两者结合使用** 1. **协同工作**:在开发过程中,开发者可以先用Firebug定位问题,然后通过YSlow评估性能,找出需要优化的地方...

    FireBug1.9.1+yslow3.1.0

    FireBug和YSlow是Web开发和优化领域中的两个重要工具,尤其对于前端开发者而言,它们是不可或缺的利器。本文将详细介绍这两个工具的功能、用途以及如何使用它们来提升网页性能。 **FireBug** FireBug是一款集成在...

    YSlow

    yahoo性能中心总结的高性能网站设计的14条规则,这个工具就是用来根据这些规则对你的网站进行测试评分的,下载后直接拖到firefox里就可以自动安装了,但是先要装另外一个插件firebug,在我上传的资源列表里可以找到

    页面性能测试Showslow+Yslow

    本文档主要介绍了Showslow和Yslow的部署、使用方法,为需要进行页面性能测试的同僚提供入门帮助,希望能对各位有所帮助。

    firefox-firebug-yslow.zip

    结合Firebug和YSlow,开发者可以在Firefox 35.0.1环境下进行全方位的前端开发工作,从代码编写到性能测试,从问题定位到优化实施,都变得更为便捷和精准。这两个工具的组合使用,不仅能够提升开发效率,而且可以确保...

    firefox基于firebug的插件yslow-3.1.0

    YSlow是Yahoo发布的一款基于FireFox的插件。 安装YSlow必须首先先安装 Firebug,然后下载YSlow,再对其安装。 YSlow可以对网站的页面进行分析,并告诉你为了提高网站性能,如何基于某些规则而进行优化。 YSlow可以...

    yslow-3.1.8-fx汉化最新版

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

Global site tag (gtag.js) - Google Analytics