Performance Parameters/Rules of YSlow:
The Yahoo’s Performance team listed out 34 parameters/rules which greatly affect the performance of the webpage,out of which YSlow analyzes the components based on the following 22 testable parameters which are listed in the order of importance and effectiveness.
1.Minimize HTTP Requests
2.Use a Content Delivery Network
3.Add an Expires or a Cache-Control Header
4.Gzip Components
5.Put StyleSheets at the Top
6.Put Scripts at the Bottom
7.Avoid CSS Expressions
8.Make JavaScript and CSS External
9.Reduce DNS Lookups
10.Minify JavaScript and CSS
11.Avoid Redirects
12.Remove Duplicate Scripts
13.Configure ETags
14.Make AJAX Cacheable
15.Use GET for AJAX Requests
16.Reduce the Number of DOM Elements
17.No 404s
18.Reduce Cookie Size
19.Use Cookie-Free Domains for Components
20.Avoid Filters
21.Do Not Scale Images in HTML
22.Make favicon.ico Small and Cacheable
YSlow analyzes all the components of the page and then provides a grade to individual components based on the above set of parameters.
Getting Started:
In order to use YSlow the user needs to install the Firebug add on for Firefox first and then install the YSlow add on .After the installation of YSlow it shows as an independent tab on Firebug
In order to run YSlow and view the results Firebug must be enabled and the Firebug window must be open .Then the user can right click on the YSlow icon and check the Autorun feature.
Now YSlow will run automatically each time a new page is loaded and the corresponding results can be seen.
Firebug can be downloaded from https://addons.mozilla.org/en-US/firefox/addon/1843
YSlow can be downloaded from http://developer.yahoo.com/yslow/
Features of YSlow:
Ruleset:
1.The user can choose any of the predefined Rulesets like YSlow(V2)/Classic(V1)/Small Site or Blog to rate the website on those set of parameters
2.The User can also create his own ruleset by omitting any of the above mentioned parameter
Grade Tab:
3.Shows performance grade like(A,BC, upto F) on individual rules
4.Shows an overall performance score along with an overall Grade for that webpage
5.Provides an option to the user to filter the parameters based onContent/Cookie/CSS/Image/Javascript/Server
Components Tab:
6.It shows the total no of components along with total weight in bytes.
7.It groups the components under different subgroups like doc,js,css,iframe,flash,cssimage and image
8.Under individual group it shows the Components along with informations like Size,GZip,Cookie received,ETag etc.
Statistics Tab:
9.Shows total no of HTTP requests and a total weight in terms of Empty Cache and Primed cache as 2 Weight Graphs
Tools Tab:
10.Provides the user with various integrated tools like JSLint,All JS,All CSS,Smush IT etc.
11.Shows a printable View of grades, component lists and statistics
How YSlow works:
1.It gets all the components of the page by crawling the DOM
2.It fetches information such as size, whether it was gzipped, Expires header, etc about each component
3.If Firebug’s Net panel is available it gets this information from this. If the component’s information is not available from Net panel (for example, the component was read from cache or it had a 304 response) YSlow makes an XMLHttpRequest to fetch the component and track its headers and other necessary information
3.YSlow generates a grade for each rule taking into account all this data of the page and ultimately produces the overall grade for the Webpage
4.Looking at these statistics the user can work on the points and rerun to see if it made any improvement to the performance of the webpage or not
Advantages of YSlow:
1.The user can significantly improve the performance of the website
1.The user can design faster web pages
2.The user can reduce the end-user response times
3.The user can get the most potential for improvement by focusing on the front-end
Reference:
http://developer.yahoo.com/performance/rules.html