Improving Page Load Times
Page load times are obviously important. But why are they important? A fast loading website will reduce you website’s bounce rates and improve overall search engine rankings. Hutz Media Ltd. develops web pages that load quickly so that your customer doesn’t just click the back button before the page has finished loading.
Every Second Counts
The average user has no patience for a page that takes too long to load. In fact, if your page takes more than 4 seconds to load you have already lost 25% of your potential customers.
Websites serve many different files to a user when they are requesting a web page. After the initial HTML file is sent, the web browser loads all of the page’s scripts, stylesheets, and images. The browser doesn’t render the page until all of the scripts and stylesheets are loaded. Each additional file means a new request to the server which can add on an additional 100 milliseconds each.
We develop web pages that are fast using techniques such as minification, compression, and concatenation.
Page load time can be improved by using a tool to remove unused data in scripts and stylesheets such as white space or other redundant data. Typically you can reduce the size of the file by 30-90%.
How much of a difference will this make? On a typical web page there are 322Kb of scripts and stylesheets. If the size is reduced to 32Kb then the page’s load speed can be improved by 0.5 seconds on a standard high speed.
Concatenating (combining) assets is another great way to improve a web page’s loading time. A typical webpage has 96 individual HTTP requests to the server. In addition to minimizing scripts and stylesheets you can concatenate all of your scripts or stylesheets into their own file. Remember that these files are usually loaded before the web browser will even begin to render the web page.
Images can be combined as well. Facebook and Twitter combine all of their small icon images into one larger file to reduce the number of server requests and save bandwidth. This technique is often used on smaller images and can greatly decrease the number of HTTP requests to the server which will improve your page’s overall load time.