Front-Loading Web PerformanceBy David F. Carr | Posted 2007-10-26 Email Print
Losing its lead in Internet traffic and ad revenue along with its chance to win the search market, Yahoo aims to reinvent itself. But with a slowing economy and downward forecasts for earnings, how bad are things for Yahoo? That could depend on Microsoft’s plans to buy the struggling Web portal.
Front-Loading Web Performance
In seven years at Yahoo, Steve Souders had focused most of his efforts on back-end engineering tasks—squeezing more performance out of a database and optimizing memory usage in C++ programs running on a server, for instance. So three years ago, when he was named chief performance yahoo and charged with improving the user experience for visitors to Yahoo Web sites, he expected it would mean doing more of the same.
But it has not worked out that way. In the course of investigating the elements of user experience, Souders found that the biggest impact came from the communications between the Web site and the user's browser. His findings form the core of the lessons he imparts in a new book, High Performance Web Sites (O'Reilly, September 2007).
And at a site like Yahoo, back-end engineering is primarily about how quickly the site can assemble HTML documents—personalizing pages, retrieving information from databases, merging news feeds and feeding the results into a Web page template. This brought Souders to the sobering conclusion that he'd spent most of his career at Yahoo worrying about five percent of the performance problem. "It turns out that 80 percent to 90 percent of end user response time is spent on the front end," he says. "So the greatest potential for improvement is on the front end."
With this understanding, he and a small team of engineers set to work figuring out how to improve the speed at which Yahoo delivers pages.
There's nothing new in recognizing the importance of response time to Web development—it's long been known that users forced to wait more than a few seconds are likely to become frustrated and depart for some other, faster site. The conventional advice includes limiting the number and file size of images on a page to make it load more quickly.
But Souders' performance team found some more subtle strategies, which they have codified into 14 rules (see box, next page). Most of the rules revolve around making sure the browser doesn't have to work too hard to load and display Web pages, particularly by making maximum use of the browser cache. That's where your browser gets rid of bits and pieces of Web pages you've viewed.
For example, if a visitor has been spending time at yahoo.com, the cache on his or her machine will contain a copy of the Yahoo logo. If the visitor leaves the Web site and comes back, the browser can display the cached copy of the logo very quickly, avoiding the need to retrieve a new copy from the Web server.
So it would be simpler in some ways if every Web page were delivered as one big file rather than dozens of smaller files. On the other hand, if you can identify the files included in a Web page that only change infrequently and get the browser to cache them, you can cut down on the total amount of data transmitted.
By applying a few of these simple rules, Souders' team was able to make a big impact on a key section of the Yahoo site—its search results page. "Within a year, we were able to improve response time by 40 to 50 percent," Souders says.
(To grade your Web site against Yahoo's rules, download YSlow, a Yahoo-developed open source add-on to Firebug, another Firefox browser extension. Together, YSlow and Firebug provide a variety of tools for profiling and debugging Web sites and applications.) —D.F.C.