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!