Things that will make your website much faster

What will make my website faster? How to optimize page load time? How to make web site appear to load faster for end user?

Updated Feb 9, 2011.

This is excerpt from article: How big HTML images / CSS / JS / png / etc. should be to fit network packet (MTU) efficiently

List of things that will make your website much faster:

  • Server must support Keep-Alive. Otherwise change server / host / hosting company / etc. Do it NOW!
  • Reduce HTTP requests (CSS sprites, combine CSS, combine JS, inline CSS, inline JS)
  • Minifiy HTML, JS, CSS. Google Closure Tools, YUI Compressor, Minification
  • Gzip text/html, css, js (IE6 does not un-gzip CSS and JS, if reference is not from HEAD)
  • For IE 5 & 6 use gzip-only-text/html
  • Check if (Content-Encoding: gzip) then (Vary: Accept-Encoding) to allow cache both versions in proxy servers
  • CSS goes in head, JS goes at bottom – right before body closing tag
  • Defer JS if possible. Defer allows to load js after onload
  • Image formats: for photos – always use JPG, for everything else – PNG 8, for animations – GIF
  • Compress images: for JPG use jpegtran or jpegoptim Adobe Photoshop or Advanced JPEG Compressor (both non-free) or free GIMP, for PNG use OptiPNG or PNGOUT. I use non-free but the best one – PNGOUTWin
  • Think connections! Waterfall. webpagetest.org (probably the best site for web page speed / optimization test), Zoompf (a little overkill, but can be useful), Pingdom Tools
  • Try to serve assets in parallel, e.g, images.example.com, images2.example.com; subdomains can be on the same IP
  • Use 2-3 max 4 sub-domains
  • Optimize response headers, smaller, meaningful
  • Avoid redirects (301, 302, META refresh, document.location)
  • Remove ETAG
  • Use Expires + cache-control
  • 25k and greater files are not cached on iPhone
  • Cache dynamic content PHP, ASPX, ruby etc.
  • example.com?param is not cached by most proxies
  • Serve static assets from cookie-less domain, like yimg.yahoo.com
  • After onload via js can pre-cache images (if you know where visitor will go next)
  • Can use double heads (if a lot of meta then put 2nd head at the bottom after closing BODY tag)
  • Use CDN if can afford

And remember about:

Related tools / links:

More reading and watching:

While making website faster, do not forget about security:

Things that big guys (such as Google, Microsoft, Yahoo, Akamai) do. This requires custom software, customized Linux / BSD / Apache compilation, and of course deep knowledge in networking, OSI model, TCP, etc.:



P.S. This blog (wishmesh.com) is not optimized for anything (speed, size, etc.). People are lazy. They optimize only when there is reason to do it, and we like most humans are lazy, so this blog runs on default WordPress hosted on shared server.