Little Known Ways to Make Your Website Load Faster

1 January 2012
Little Known Ways to Make Your Website Load Faster

Website load times are the key factor in how visitors form a first opinion of your website. And now since the recent revamp of Google’s indexing and ranking algorithms, it’s imperative that your website load as fast as possible. Slow websites translate eventually to lower search engine rankings, something that is hard to reverse in a short time. When every click counts, you need ways to make your website load faster so your visitors are happy and your ranking improves. If your website is slow to load, here’s how to fix it.

Speed Secret #1 – Reduce HTTP Requests

The single most important factor in page load times (aside from a long running query) is the number of HTTP requests that are made when a first time visitor goes to your website. HTTP requests are made for resources such as CSS files, JavaScript files and images. If you have many of these resources on your main landing page and your visitor is new, the browser has yet to cache such resources which results in a longer wait time for your first time visitor. Not the impression you want to make.

You can do one of two things: simplify the page or combine resources to reduce requests. When simplifying the page isn’t an option, consider combining CSS files in to one single file. You can also minify CSS files, a technique that removes unnecessary characters from the source file so the CSS files download more quickly. This works the same for JavaScript files as well. Combining and minifying can reduced download times significantly and the busier your website, the more benefit you will reap.

Speed Secret #2 – Order Your CSS Files Ahead of JavaScript Files

A little known secret to improve overall page download speed is to place all CSS file requests ahead of JavaScript file requests in the head portion of your page. The reason is that CSS files can be downloaded in parallel but if a script file is thrown into the middle of a set of CSS files, the browser has to wait until the script file is downloaded and executed before continuing to download CSS files in parallel.

Every script file downloaded has to be executed sequentially, which means certain portions of your page may not render until the script load and execution completes as there is no style instructions to render the page yet. This is also true for inline script as well. If possible, try and put all scripts (including inline) after all CSS files in the head portion of your page.

Speed Secret #3 – Use Gzip or Deflate to Compress Pages

To save bandwidth and therefore improve page download speed, you can configure your web server to compress content requested before it is sent to the web browser. This is possible by using server-side modules such as Gzip or Deflate. Content such as CSS and JavaScript files usually contain a lot of whitespace so compressing them before download can save a significant amount of bandwidth.

If your web server is Apache 2.0 or greater, then enabling the mod_deflate module in Apache’s http.conf file will result in Apache compressing content when requested to do so by the browser. All modern browsers will automatically send a content compression request in the header of the HTTP request. If the server is configured for it, compression happens on the fly. This is true for any web server with Gzip or Deflate enabled.

Speed Secret #4 – Use a Content Delivery Network (CDN)

A CDN is a way to spread out resource requests over a number of host names and serve them up from the closest server to the requester. Web browsers are limited to the number of parallel connections to any one hostname at a time. Remember that downloading resources in parallel increases page load speed as in the case of CSS files. So to get around the parallel connection limitation, using multiple file servers with different hostnames helps a browser use more parallel connections.

CDN providers such as Amazon’s CloudFront, provide the infrastructure and simple tools to help you serve content from servers around the world. Once configured, you replace the URL to your server that would normally be used for say an image or script file and replace it with a unique URL of the CDN provider. That’s it. Instant CDN and browsers can now take advantage of parallel downloads from multiple servers.

Speed Secret #5 – Reduce the Number of Queries to Render a Page

When you have exhausted all other approaches and your site still loads slower than you would like, it’s time to look at how the database is queried. No matter how tuned up your queries are, on a busy website with a lot of queries performed to render pages, it’s going to result in progressively slower load times.

A little known technique is to combine queries where possible. Combining means taking several queries required for generating page content and making a single query that generates all page data needed, eliminating multiple queries that result in the same information collectively. Sometimes this isn’t possible when different portions of the page have completely unrelated data. Think about where you can combine queries and you will notice a substantially faster page load time and a less resource hungry database.

Conclusion

While not an exhaustive list of page loading speed secrets, following these suggestions will absolutely result in faster load times. Other areas to look at are combining images using CSS sprites, minimizing URL redirects, minimizing DNS lookups and hosting provider bandwidth limitations. Infrastructure plays a huge role in page generation and serving speed so if you have a friend in the infrastructure department, pay him a visit and work together to optimize your website.

If you enjoyed this post, please consider leaving a comment or subscribing to the RSS feed to have future articles delivered to your feed reader.

Tags: , , , , ,