I'm obsessed with metrics. I'm obsessed with the number of RSS subscribers. With Google PageRank. Google seems to push faster internet to everyone, with fiber to the home, their own DNS, the page speed plugin and hosting Ajax libraries. As I wanted to get some more Google love, going from PR4 to PR5 and not falling back to PR3, I needed to speed up my blog. But where to start? Isn't this impossible if you're not a professional? All of you might have thought about speeding up your website or blog I guess along the same thoughts:
- Page speed influences pagerank (PR) in the future
- Firefox experienced a 15% increase in conversion for downloads, by speeding up their landing page recently. For a blog this means better conversion of RSS subscribers and newsletter signups.
- I was shocked when I saw Google Webmaster Tools show page speeds of 5-15 seconds, still not sure why but urgently needed to get better.
- Faster pages just feel more professional.
- Took the opportunity to declutter the blog. Removed external widgets like PostRank I no longer use.
The result of my work is that page loading times are down from 4sec to below 1sec mostly (measured by Pingdom Tools) - Still too slow as I want to get below 0.5sec, but much better than before.
Here are the 8 steps I took to get this amazing improvement:
- I've added a cookieless domain, cmstatic.com to post stuff I do not want to put into the CDN. YSlow suggested this and I've seen Stack Overflow use sstatic.net.
- Move to a CDN - most of my readers are in the US, my server is in Germany. This leads to slower image downloads and especially latency, or startup times before the first byte arrives. I've chosen Cloudfront for now because it was easy to setup and I had an Amazon account. I'm using CloudBerry for uploads, it's free in the basic version and just works. I might move to a cheaper CDN that better supports (SimpleCDN is full!) GZIP and expire headers. I've added a domain for my CDN usage at cdn.cmstatic.com which adds some flexibility.
- Added expire header in the far future with a version URL scheme ( /version/images/ ... e.g. /1/images), so everything is cached in the browser. I can increase the version number with new assets. Expire headers are easy to do with Apache on cmstatic.com by adding
.htaccess, more difficult with Cloudfront (see above, a reason to possibly move to another CDN). I also removed ETags when possible so the
.htaccesslooks like this:
ExpiresActive On ExpiresDefault "access plus 1 year" FileETag None
- Added GZIP where possible, was easier with Apache than Cloudfront:
<Files *.js> SetOutputFilter DEFLATE </Files>
- I've reduced the number of posts on the page. Now there are only 3 posts on the start page. I might move to summaries, as they are shorter, have less images, faster download.
Overall I'm pleased with the results. Especially as the page really feels much faster to me, not only the metrics are better. So what's left to do: External images and JS, like tweetmeme, quantcast and Google Analytics still are slow - something I need to solve.
I had some fun during all of this and learned a great deal about CDNs, so I suggest you do the same.