16 December 2007

Yahoo Developer Conference

Yahoo have 14 rules for high performance websites. Not going to cover them all. This looks very similar to the info Nate has presented in the past.

Rule 1:
Make fewer http requests by using CSS sprites and combine scripts and stylesheets. Most big sites don’t do this. Using something called the combo handler, which is unfortunately Yahoo only at the moment.
Rule 2:
Some discussion about the ideal size of sprites and the maximum pixel size before Opera suffers a buffer overflow. One suggestion is to use rounded corner boxes with a transparent centre, allowing you to use CSS borders. Sprites aren’t always a good idea on page heavy sites as you pay the price on maintenance. Some discussion on whether you should optimise on a page/module basis or a site basis. Apparently Yahoo Europe have developed a public tool for CSS Sprites.
Rule 3:
Add an expires header on images, scripts etc.
Rule 4:
Gzip HTML, scripts, stylesheets, XML, JSON etc.
Rule 5:
Put stylesheets at the top, as per spec. CSS at bottom is actually faster, but nothing renders. Use link, not @import, as this also appears faster.
Rule 6:
Put scripts that aren’t crucial to the loading of the page at the bottom of the page to prevent them from blocking the load.
Rule 7:
Avoid CSS expressions as they seem to slow the page. I stupidly thought she meant filters. Doh!
Rule 8:
Minify JavaScript and CSS, but don’t obsfucate.
Rule 9:
Make Ajax cachable.

Notes by Andy Budd

No comments:

Post a Comment