Even Faster Web Sites

I borrowed Steve Souder's book "Even Faster Web Sites" but could not got a chance to complete the reading. However, this book is an addition to "High Performance Web Site", and is providing more info about building faster Web site. Here is some notes of one presentation from Yahoo!

• Split the initial payload
• Load scripts without blocking
• Don't scatter scripts
• Split dominant content domains
• Make static content cookie-free
• Reduce cookie weight
• Minify CSS
• Optimize images
• Use iframes sparingly
• To www or not to wwww

Load scripts without blocking - one example is msn.com

Advanced Script Loading
XHR Eval (same domain)
XHR Injection (same domain)
Script in Iframe (same domain)
Script DOM Element
Script Defer (IE only)
document.write Script Tag (IE only)

Optimize images:
Tools such as PNGOUT and pngcrush are a good place to start.

Here are some random Web Performance notes:
If you make XMLHttpRequests to services that return XML (or JSON, or plain text), make sure your server gzips this content as well.

However, we found in our study that regardless of usage patterns, the percentage of page views with an empty cache is always ~20%.

you can use the Vary: Accept-Encoding response header to tell the proxy to cache this response only for clients that send the same Accept-Encoding request header.

you can use a different header -- Cache-Control: Private -- which eliminates proxy caching completely. Another way to prevent proxy caching is to use the header Vary: *.

CSS Sprits is not intended for use with content images (those that appear in the HTML in <img /> tags, such as photos in a photo gallery

browsers block all downloads when they encounters a <script> tag. So until a script is downloaded and parsed, no other downloads will be initiated.

If you do decide to minify CSS, apart from the option of minifying manually (simply removing comments and whitespace), you can use some of the available tools, such as CSSTidy, PEAR's HTML_CSS library (http://pear.php.net/package/HTML_CSS/), or SitePoint's own Dust-me Selectors Firefox plugin.

most browsers (Opera is an exception) won't render anything on the page until the all the style sheets are duly downloaded and parsed. Additionally, none of the images referenced from the CSS will be downloaded unless the CSS parsing is complete. So it's better to include the CSS as early on the page as possible.

    * Firebug's Net panel for Firefox, at http://www.getfirebug.com
    * YSlow, Yahoo!'s performance extension to Firebug, at http://developer.yahoo.com/yslow/
    * LiveHTTP Headers for Firefox, at http://livehttpheaders.mozdev.org/
    * Fiddler -- for IE, but also a general-purpose packet sniffer, at http://www.fiddlertool.com/fiddler/
    * HTTPWatch for IE (commercial, free version), at http://www.httpwatch.com/
    * Web Inspector for Safari, at http://webkit.org/blog/?p=41