Steve Souders: "High Performance Web Sites: 14 Rules for Faster Pages"

video http://www.oreillynet.com/fyi/blog/2007/09/steve_souders_high_performance.html

This is a fascinating and usable book. The advice is presently clearly and simply and can be applied, and doesn't have to change your site much. Reading this before you develop your site means you may do things differently.

Rule 1: Reduce #HTTP requests.

concatenate style sheets and JS files.

image maps

CSS sprites

Rule 2: Use a content delivery network

split static content to edge servers

Rule 3: Add an Expires header

for all static content

Apache

IIS


Rule 4: Use gzip components

90% of browsers support compression

70% compression on html documents

(web server configuration)

Apache

/etc/httpd/conf/httpd.conf add
# http://httpd.apache.org/docs/2.0/mod/mod_deflate.html
AddOutputFilterByType DEFLATE text/html text/plain text/xml

IIS

See http://www.microsoft.com/technet/prodtechnol/WindowsServer2003/Library/IIS/25d2170b-09c0-45fd-8da4-898cf9a7d568.mspx?mfr=true

Rule 5 Put style sheets at the top

All style sheets need to downloaded before rendering starts.

In IE use LINK not @import

Rule 6: Move scripts to the bottom.

scripts block rendering of everything below them.

script defer is NOT a solution

Rule 7: Avoid CSS expressions

problems are expressions are evaluated many times (e,g, mouse moves)

One time expressions OK if can code it.

Or add an event handler and tie to that. (Saves many executions).

Rule 8: Make JS and CSS external

inline: HTML document is bigger, but

external: more HTTP requests, but cached variables

rule 9: reduce DNS lookups

these block parallel downloads. There are tradeoffs here, because you can split your web site across multiple domains to allow more parallelism in downloading content. DNS entry lifetimes time out, though there are caches of these in the browser, OS, IS DNS etc. DNS lookups take time and this decreases performance. Also use of keep-alives helps.

Rule 10: Minify Javascript

Remove white space and comments

Also obfuscate (minify is safer)

Rule 11:avoid redirects

Examine server logs for 301 & 302 status codes. Apart from intentional redirects e.g. simple cases such as a missing "/" on URL dir a directory.

Rule 12: Remove duplicate scripts

cause extra HTTP requests

Rule 13: Configure ETags

But be careful of incompatibility between web server instances. This is particularly a problem where there are multiple server (e.g. cluster) serving up the same content. (Some use inode, which may differ between servers).

(Or just turn off)

Rule 14: Make AJAX cacheable

a personalized response should be cacheable. (i.e. still use expires)

Or use different page name (e.g. address book page URL may contain modification date.

So if had been modified, then link is different and new copy downloaded).


Reference

http://www.oreilly.com/catalog/9780596529307/index.html#details

High Performance Web Sites : Essential Knowledge for Front-End Engineers

By Steve Souders

First Edition September 2007

Pages: 168 (More details)

ISBN 10: 0-596-52930-9

ISBN 13: 9780596529307

Tools referenced

Fasterfox for measuring and improving Firefox performance.
YSlow for Firebug
Firebug edit/debug/monitor CSS/HTML/JavaScript fot Firefox.
IBM Page Detailer is a graphical tool that enables Web site developers and editors to rapidly and accurately assess performance from the client's perspective.

New book http://oreilly.com/catalog/9780596522308/

Even Faster Web Sites
author Steve Souders
pages 254 pages
publisher O'Reilly Media
rating 8/10
reviewer Michael J. Ross
ISBN 978-0596522308
summary Advanced techniques for improving website performance