4 Ways to Decrease Page Loading Time

By Karthik Viswanathan

Users love to move from one page to another at a fast rate. They can easily obtain more information and find what they are looking for. Unfortunately, not everything on the internet loads quickly. In this tutorial, I’ll show you 4 ways to decrease page loading time.

Let’s begin:

Place JavaScript files at the end of your document

JavaScript files load differently than other HTML elements. While a normal HTML element is loading, the rest of the page continues to download. On the other hand, a JavaScript element must fully load before the rest of the page can continue. In order to counter this problem, place JavaScript files at the end of a document. This ensures that the main content of a page has a low loading time.

Reduce HTTP Requests

Having over 5 JavaScript and CSS files that are referenced to puts a burden on your viewer. These excessive requests to files outside the document can increase page load time substantially. Combine your JavaScript/CSS together and place them in one large file. For those of you using WordPress, consider editing your theme if it has too many requests. It only takes a few minutes to complete this simple job (copy-paste) and decrease page loading time!

Minify Large Files

Some files are inherently large. Users will have trouble downloading long, documented code when visiting a website. A simple way to reduce file size is to minify your files. For example, the documented, uncompressed jQuery.js is about 120 KB. A minified version is only 19 KB and is perfect to decrease page loading time. The Yahoo! User Interface Library has a command-line compressor than can automate this process for you.

GZip Your Files

GZip is such an easy way to help both you and your user. It can compress most of your files so that users can download them faster. During this process, much of your bandwidth is also saved. With a method that both reduces the cost for your site and decreases page loading time, who could ask for more? Take a look at the Lateral Code GZip article for further information on this topic.

With these 4 simple methods, I hope that you can fortify a nice user experience on your website.

Make sure to check that you have correctly implemented these methods using YSlow! Good luck!

Karthik – nice job. I tweeted about this article on Twitter. Also, although they have “been around for a while”, you’re right, not everyone knows about them. Just because something exists doesn’t mean that the entire community is aware that it exists. Plus, Yahoo’s information can be a bit daunting to newcomers.

Yes, they are (unless you’re sending silly headers). However, most visitors won’t have a primed cache. Whenever you get a big traffic spike from social bookmarking sites most people will be first time visitors and usually they won’t check out your other articles.

But even regulars will have to download these files over and over again. The reason for this is pretty simple: The caches are just way too small. Often it doesn’t even last for a single day.

Basically caching only helps those visitors who read a few articles in one go. Apart from that there isn’t much of a difference. If you got a lot of regulars it maaaaaybe saves about 10%, but that’s about it.

Gzip on the other hand can peel up to 50% of a given page. That’s a pretty big improvement – even more so if you get flooded by hits.

@video

Worst sound quality ever. It almost made my ears bleed. I’d to stop the video after a few seconds.