The other day, Glen Campbell (no, not “Rhinestone Cowboy” Glen Campbell) posted some tips on Friendfeed to help people improve the performance of their Web pages. I can’t say I completely agree with every single one of the suggestions across all situations, but they are definitely a great place to start. Glen indicated to me that his tips are “basically a distallation of the Yahoo! Developer Network “Best Practices”“, but I think he’s done a really good job of pulling out the meat of those best practices and putting them in a language that can be easily understood. I hope you will evaluate the tips and best practices for yourself and use the tips that apply to your situation as well as you can.
Following are the tips Glen posted:
- Only ONE CSS file, at the very top of the page. EDIT: if it’s a frequently-accessed page, include all the CSS inline. (avoid @include, too)
- All static content (images, CSS, JS, Flash) served with a Cache-Control: max-age= header; set the max-age to a VERY long time.
- Store your static content (images, CSS, JS) on an edge-cache — you can do this pretty cheaply via Amazon S3.
- Optimize your images and compress your CS and JS files so that consume as little space as possible.
- Turn all your frequently-used images (icons, not content images) into sprites: the result is ONE download from the server per session, instead of dozens per page view. TCP connections are the real killer.
- There. I just saved you $750.00 for your next “Web Programming for Performance” workshop.
Thanks again to Glen for posting these tips and allowing me to share them on our blog; and thanks to Yahoo! for the original “best practices” documentation.