There are many ways to speed up the loading of your web pages. Minimizing HTTP requests is one great way to do that. Browsers spend 80% of their time fetching external components including scripts, stylesheets, and images. So reducing HTTP requests has the biggest impact on reducing response time. Here are a few tips, tricks, and tutorials for you to try out if you are having loading problems with your website or web pages:
Combining Your Files
You can reduce the number of HTTP requests by trying to consolidate your files. For instance, if you have several scripts running on your page, try combining them into one or two scripts. Similarly, combining all your CSS into one stylesheet can also help. Obviously this can be more challenging when your scripts and CSS vary from page to page, but anything you can do to consolidate will improve your response time by minimizing HTTP requests.
These are the preferred method for reducing the number of image requests from your page. Instead of just inserting all your images with the <img> tag in the HTML, use the CSS “background-image: url(http://www.somesite.com/someimage.jpg;” parameter to load them and use things like “background-position:” and “background-repeat:” to display the desired image segments.
While combing several images into one or a few images doesn’t affect the overall size of the images you are trying to load, reducing the number of HTTP requests from multiple images to just one or two does speed up the page. However, image maps only work if the images are contiguous in the page, such as a navigation bar. Defining the coordinates of image maps can be tedious and error prone. Using image maps for navigation is not accessible too, so it's not recommended.
If you incorporate inline images into your page they will use the “data: URL” scheme to embed the image data into the actual page. However, this will increase the size of your actual HTML file. Combining inline images into your (cached) stylesheets is a way to reduce HTTP requests and avoid increasing the size of your pages. It should be noted, however, that inline images are not yet supports across all major browsers.
If you want to speed up your website, reducing your HTTP requests is a great place to start. These tips and tricks should help you get started!