How to Improve Website Performance

Let’s discuss a few highly effective ways to improve website performance. I’ve used these methods improve the speed of OpenView’s websites. If you’re interested in improving your website speed this article will provide you with a solid set of questions to present to your creative team.

Use a CDN

Host image, video, audio and media files on a CDN (content delivery network), including CSS & JavaScript. We used the WordPress W3 Total Cache plugin and MaxCDN to do this, and we were able to reduce 16.3 sec­onds of load time across all 3 OpenView websites.

What’s a CDN?

A content delivery network (CDN) is a large distributed system of servers deployed in multiple data centers in the Internet. The goal of a CDN is to serve content to end-users with high availability and high performance. CDNs serve a large fraction of the Internet content today, including web objects (text, graphics, URLs and scripts), downloadable objects (media files, software, documents), applications (e-commerce, portals), live streaming media, on-demand streaming media, and social networks.

Wikipedia

Reduce HTTP Requests

Quite simply, use as few images in your designs as possible, and have your developers consolidate style and script files (CSS & JavaScript) whenever possible. Web browsers load most website files sequentially, not simultaneously, and loading fewer files, even if they’re larger in size, is going to improve website performance.

Use Image Sprites

If you combine 100 icons into a single image it can reduce the number of requests by 99, significantly improving the time it takes to load the page. This common technique is referred to as a CSS image sprite. I’ve done this for OpenView’s icons used across all 3 sites, and has reduced the number of requests and therefor website speed.

Reducing the number of stylesheets you load can be easy using recent improvements in CSS technologies. Early this year I replaced CSS with LESS, a better language for creating stylesheets, and consolidated 9 separate CSS files into 1. This removed 8 requests from the page without affecting the websites design, and improved my workflow productivity.

Compress & Cache Everything

Compression involves encoding information using fewer bits than the original representation would use, and can have a drastic impact to improve website performance. Compression is useful because it helps reduce the consumption of expensive resources, such as disk space or bandwidth. As your creative team about using Gzip compression.

Caching is a technology that transparently stores data so that future requests for that data can be served much faster. Caching can significantly improve website performance. It can reduce the cost of your monthly hosting bill too. I would suggest asking your creative team about:

1. Browser Cache — Expires header, Max-Age and mod_expires
2. Server Cache — Page, database and object caching with APC or Memflushd. These tools require installation on your web server.

Load Files Simultaneously When Possible

Web browsers load most website files sequentially, not simultaneously. It’s a best practice to load anything and everything simultaneously when possible. The standard way to load JavaScript is done sequentially. However, it’s not hard to use an asynchronous approach to load each file simultaneously. Check with your creative team to make sure that your loading your JavaScript files asynchronously.

1. Browser Cache — Expires header, Max-Age and mod_expires
2. Server Cache — Page, database and object caching with APC or Memflushd. These tools require installation on your web server.

Good Hosting Can Greatly Improve Website Performance

We are running WordPress on Lightspeed with APC & Memflushd and the performance is noticeably better than a standard apache setup. If you’re running a web-based application that makes heavy database calls I highly suggest looking into a better server operating system such as Lightspeed or NGINX.

In Conclusion

Do you have a better understanding of how to improve website performance? I hope so. If you’re itching for a more in depth look at website performance I highly recommend High Performance Web Sites by Steve Souders.

If you have any questions please don’t hesitate to ask!

More Resources to Improve Website Performance

• Speeding Up Your WordPress Website
• Excellent Tools to Improve Website Performance
• Website Speed Articles at Speckyboy
• Matt Cutts Interview on Website Speed & Google Ranking
• How to Improve Website Performance of a WordPress Site