Hello everyone and welcome to this tutorial on “How to speed up your website? Web page optimization tips” PART 02.
So, in my last post on website optimization, which is "10 tips to speed up your website? Web page optimization tips – Part 01", I described 10 ways to speed up your website. If you have missed those tips, I think you should not. Today I will be highlighting 5 more ways to actually give a Sonic Boom to your website. So, lets start.
Bored with the texts? Watch the video instead.
1. Leverage Browser Caching: Every time an user visits an website, the browser has to download a number of CSS, JS and image files which costs data that ultimately mean waiting. Browser caching enables the browser to store these files locally on user's computer so that the next the user visits the website the browser will load the locally saved files instead of downloading them again. This reduces the speed so much incredibly that you will get stunned if you haven't experienced it yet. To enable browser you have to add following lines of code into your .htaccess file.
## EXPIRES CACHING ##
So how this works? The code runs only when you have mod_expires.c module running. In line 4, for example, any files of type JPG will be cached or stored in user's local computer for 1 year. This means, from the when the user will first visit the site to the next 365 days, the image will be downloaded once and will be displayed again and again from user's computer. However, if the user cleans his browser cache, or uninstall the browser or the computer, the cache will be gone. If you have any more file type, you can add them just like others.
2. gZIP Compression: When browser requests for a website, the server has to sent all the output HTML and CSS, JS files to the browser. If the files are bigger then it will obviously take more time for the browser to finish downloading the files and display the output to the user. Gzip is a compression Technic that dramatically reduce the file size of the files that the server will send to browser. Gzip works web files so toughly because these files contains texts that repeats a lot. Gzip replaces repeated text temporarily. It has been found that gZIP may reduce file size upto 70%! Enabling gZIP is quite simple in your Apache server. Just add the following code to your .htaccess file.
However, enabling gZIP will require you to have mod_deflate.c module running. I am not describing the code, let me know your query, if any.
Header append Vary: Accept-Encoding
4. Keep Alive: Keep alive enables the browser to make one TCP connection with the server and download all resources that needs to be downloaded from that server. Its like, you have to make 4 orders to a shop. So you by using Keep Alive, you make 1 phone call and order 4 orders and then cut the line instead of making 4 individual calls for 4 orders. To enable Keep Alive add these lines to your .htaccess file
Header set Connection keep-alive
5. Remove query strings from static resources: As we can turn on browser cache, we should know that browser will not cache a file if the link to the file is containing any query variable. For example, http://www.mysite.com/style.css?v=2 will not be cached by the browser though you wanted to have CSS files being cached, this link contains query variable "v", so the browser won't cache it. Anyway, there is nothing to code, just remove these query variables from files to be cached.
Alright guys, so try to implement these changes on your project and see the difference. I am sure you will say WOW! Let me know how your site feels now ....