MaxCDN, a content delivery network solution has recently redesigned their homepage and site and has shared their learnings on how they leveraged WordPress (and other technologies) to achieve a sub-half-second (.5s) load time:
There are literally a ton of factors how we changed to get such a fast page load. To break it down, we’ll discuss what we did with the code itself, CSS styling, JavaScript, server/hosting, and the images to achieve this incredible page speed.
They go on and share their techniques and implementation strategy that you could leverage for your own use. We’re writing about it because they are not only using WordPress as their platform of development but also WP Engine, which we all know and love as a managed WordPress hosting solution.
Here’s their implementation is a nutshell:
- Good code. Period. All over the place.
- HTML5
- CSS3
- Asynchronous javascript
- Minify using WP Minify plugin
- DNS prefetching
- CSS Hat
- CSS Reset via Normalize.css
- Intelligent use of responsive design methods.
- Solid colors for less styling, less markup, less time spent writing code.
- Splitting up CSS into more than one file.
- Use spritemaps, see Sprite Cow and Sprite Master Web.
- PNG fix
- Optimize your images using apps like ImageOptim (I use this one myself).
- Use scalable vector graphics. Try out tools like Scour. Make sure you head towards inline SVGs into CSS and with backwards compatibility with PNGs – check Modernizr.
- Caching via W3 Total Cache and Memcached
- Use keep-alive and cache-control headers. See HTTP accelerators like Varnish.
- Enable Gzip to greatly reduce file sizes.
- And, of course, use a CDN.
- Be Happy.
Thanks for the tips guys and for sharing your strategies and methods! Perhaps many of us will be able to use your example and optimize our own blogs and sites more fully!
8 Comments