High Performance Web Sites

A book written by a friend of mine at Yahoo!, for which I did a technical review last summer, was published earlier this month. High Performance Web Sites by Steve Souders is just crammed full of real-world, practical information on how to present a web site so that it loads faster for the user.

The main thrust of the book are 15 rules for better server↔browser performance. Although I've been doing web-related engineering since 1994, many of the rules were new to me.

Some of the rules are completely common-sense, such as to include an expires field in the response header where you can, such as with images.

The benefit of some other rules, though, is less clear until you get the explanation in the prose of the book. For example, if you refer to external style sheets, they should be referenced from near the top of the page, but external JavaScript should generally be referenced from the end of the page. This ordering can make a huge difference in how fast a page appears to load. Why? See Rules 5 and 6 of his book.

The book ends with a long chapter that looks in depth at the front page of a bunch of popular web sites: Amazon, AOL, CNN, eBay, Google, MSN, MySpace, Wikipedia, Yahoo!, and YouTube. (Oddly, the front page of my blog failed to make the cut.) You might be surprised at how bad some of the pages are.

I received a copy of the book today (signed by the author, no less — thanks Steve!) and am excited because it seems to cover something that wasn't covered much in the manuscript that I reviewed: a plugin for Firefox's Firebug, Joe Hewitt's most excellent page debugger and inspector. The plugin, YSlow (“Why Slow?”), analyzes a page with the book's rules in mind, generating a report indicating areas for improvement.

Steve's title at Yahoo is Chief Performance Yahoo!, a position that I think it's fair for me to say I informally created and held in the early days of Yahoo. Starting in 1997, I built “Jeffrey's Page Checker” in my spare time, an internal engineering tool which checked a web page for correctness, and reported various metrics about its fluff (wasted whitespace, image overhead, etc.). It's decidedly a “Web 1.0” tool, old and clunky, but I know that it's still at Yahoo because just the other day, a friend sent me a screenshot of it still alive. A note in an upper corner read “The what's new page was last updated 7 years, 0 months ago.” Ah, the nostalgia.

Although it is still at Yahoo, I doubt that it's in use at Yahoo. Nevertheless, current Yahoo! Employees can find it at http://checker.yahoo.com.

Sadly, way back then, the position was informal, so it didn't come with the buckets of cash, options, and accolades that I'm sure Steve is showered with on a daily basis. I can't speak to the first two, but he certainly deserves all the accolades he gets, as the book represents a lot of research, tool-building, and presentation that any web-related engineer can value greatly from. Highly Recommended.

One comment so far...

Hey Jeffrey,

I can’t tell you how many weeks I spent diligently trying to clean up my horrible excuse for HTML between 2000-2001 just trying to please your page checker. And even at my best it would still spew out scary warnings at every third/fourth line of HTML. I still think you should’ve added in a grading system, so that if the page was ~80% clean, the user would receive an A grade as encouragement. But thanks – checker was useful, challenging and informative.

Curiously, I only realized that you were the Checker-master after KFC and I got back from Japan!

— comment by verena on September 27th, 2007 at 2:56pm JST (10 years, 3 months ago) comment permalink
Leave a comment...

All comments are invisible to others until Jeffrey approves them.

Please mention what part of the world you're writing from, if you don't mind. It's always interesting to see where people are visiting from.

You can use basic HTML; be sure to close tags properly.

Subscribe without commenting