How do I load my websites EXTREMELY fast, like say, Apple's?

Question

I've always been curious about how fast Apple loads its homepage - on Chrome, it says 2.98s.

Now, I know all about CDN and gzipping and the recommendations by Yahoo!, but I know there's something I'm missing out other than that, because after checking almost all the YSlow recommendations and scoring an 84 for my site, it's still not loading fast enough (4.48s on Chrome). Apple scores 82 on YSlow, but loads almost twice as fast as my site. So I'm sure I'm missing out on something.

Can any expert in the area enlighten me on how to make my websites load faster, like within 3s on average? Any suggestion/help welcome. Thanks in advance.

Answer 1

Have you considered the amount of content you're actually loading?

My experience with YSlow is that it suggests ways to make your site more efficient without affecting the display of your site. Eg. by ensuring you cache in browser, minify css, reduce the number of external scripts etc, resulting in a site that will load faster in many cases (especially in subsequent loads). But if your site is media heavy then regardless of how efficient it is, downloading content takes time on the first load. My personal blog site for example contains some images posted from my Flickr profile, YSlow checks to make sure these images are cached but it has't suggested "Load less images".

Answer 2

Look at the network panel of Firebug. If the first bar for the HTML Resource is quite long and the other bars start late then your performance is backend bounded. Then you've to look into server code to see what eats up that much time.

When the first bar is relatively small and the other bars start right after the first then your performance is frontend bounded and you should look into the missing points of ySlow which only cares about optimizing frontend performance.

(Frontend and Backend Performance in this context are used like Steve Souders defined them in his Books.)