YSlow recommendations. How necessary are they?

Question

So I've just downloaded yslow for firebug and have taken a look at the results for a site I am building.

I'm seeing recommendations, for example, to use ETags, cookie-free domain for my static components, and add expires headers.

I'm thinking, well I could go off and fix these but there's more likely a bunch of other optimizations I could do first, e.g caching results from database calls or something similar.

I don't think this site will get 'that much' usage to warrant YSlow's recommendations.

I know that you should never optimize before you know you need to, but I'm thinking things like ETags and expires headers surely only come into play on sites with really heavy traffic.

If for example, I've written a poor implementation that makes 5 (relatively small) calls to the database per request, and YSlow is telling me that my 14 images are not on a cookie-free domain, then which of those two optimisations should be tackled first?

Answer 1

You are quite correct, optimising within the application code such as

• Optimising slow database queries
• Caching of frequently executed queries
• Component level caching of frequently used components
• General speed optimisations of expensive application code

will give you much higher performance gains than the YSlow recommendations in most cases.

YSlow optimisations are usually addressed at improving the performance of static parts of your site, which generally will already perform better than the dynamic parts, prior to any tweaking.

Answer 2

The backend code is more often faster than the frontend code. Try keeping the amount of external resources (css background images, css files and javascript files) down to a minimum.

That would be the most crucial optimization one can do imho.

Answer 3

YSlow is good to check the "User Experience" that you users are seeing. Its recommendations are to help make the page appear to load quicker. E.g. 14 images to 1 image and spriting is purely a visual thing. The rule is because browsers can only download a few images in parallel at any one time.

I would always tackle backend optimizations first as they can help you towards making your site scalable, if it ever gets that big.

Answer 4

Fix whichever one your profiling says is causing the most slowdown for page views.

Remember that whatever you fix that YSlow is complaining about will most likely help later without you having to do it again, whereas database optimization will be an ongoing task.

i.e., if you split your images over multiple domains and make them cookieless, then as you add more images they should be split over those domains (hopefully automatically) and won't require effort again.

Also, Expires headers lead to lower levels of requests on your server (since the responses can be cached), which will speed up the visits for everyone.

Answer 5

Keep in mind that YSlow cannot see your backend code, so it can only base its recommendations on the browser's interaction with your site. You should certainly fix your database calls first. YSlow's recommendations regarding multiple requests, gzip, etc are pretty solid, but it's forever telling me to use a content delivery network - which makes no sense for a small site. Just don't spend a lot of time/money on every recommendation blindly, and factor in what you know and YSlow doesn't.

Answer 6

In no YSlow our .htaccess guru. But I recently built a Joomla website and used YSlow to find areas of improvement. The two areas of YSlow that you asked about above -- "Add Expires headers" and "Configure entity tags (ETags)" -- I addressed via an .htaccess file on the root of my domain.

Add Expires headers

Yahoo says: "Web pages are becoming increasingly complex with more scripts, style sheets, images, and Flash on them. A first-time visit to a page may require several HTTP requests to load all the components. By using Expires headers these components become cacheable, which avoids unnecessary HTTP requests on subsequent page views. Expires headers are most often associated with images, but they can and should be used on all page components including scripts, style sheets, and Flash."

To address this, I found and added the following code block to my .htaccess file (note: change OPENANGLEBRACKET to "<" and CLOSEDANGLEBRACKET to ">"):

    ########## Begin - Expires Headers
    #
    OPENANGLEBRACKET IfModule mod_expires.c CLOSEDANGLEBRACKET 
    ExpiresActive On
    ExpiresDefault "access plus 1 month"
    ExpiresByType application/pdf "access plus 1 month"
    ExpiresByType application/x-javascript "access plus 1 week"
    ExpiresByType application/x-shockwave-flash "access plus 1 month"
    ExpiresByType image/gif "access plus 1 month"
    ExpiresByType image/ico "access plus 1 month" 
    ExpiresByType image/jpeg "access plus 1 month"
    ExpiresByType image/png "access plus 1 month"
    ExpiresByType image/x-icon "access plus 1 month"
    ExpiresByType text/css "access plus 1 week"
    ExpiresByType text/html "access plus 1 day"
    ExpiresByType text/plain "access plus 1 week"
    ExpiresByType video/x-flv "access plus 1 month"
    OPENANGLEBRACKET /IfModule CLOSEDANGLEBRACKET
    #
    ########## End - Joomla! core SEF Section

Configure entity tags (ETags)

Yahoo Says: "Entity tags (ETags) are a mechanism web servers and the browser use to determine whether a component in the browser's cache matches one on the origin server. Since ETags are typically constructed using attributes that make them unique to a specific server hosting a site, the tags will not match when a browser gets the original component from one server and later tries to validate that component on a different server."

I decided to remove all Etags, which gave me an A Grade, by adding this to my .htaccess file:

    ########## Begin - Remove Etags
    #
    FileETag none
    #
    ########## End - Remove Etags

These two changes to my .htaccess file gave me A Grades for these two YSlow categories.

Answer 7

Please, please use no cookies and Expires for your static content.

It doesn't just help you, it helps me.

I use a slower Internet link at home, 144 Kbps. I often have it loaded to capacity, downloading updates or video files. That makes its latency go up to 800 ms or so.

Web sites that demand a lot of round trips for If-Modified-Since time checks load very slowly. Sites that use Expires properly load quickly because only the dynamic content has to actually load in.