When a user is loading a web page, for every object on the page (e.g: images, stylesheets, scripts) there is a corresponding HTTP request made to the server.
These HTTP requests will delay the response time if the web page contains large number of objects.
To reduce the delay, we have to get rid of some of the unnecessary objects.
Then we can think of combining two or more images to one (by using image sprite), we can merge two or more script files and make them one (e.g: Instead of using three/four script files we will use only one).
Then the next question is, “How to combine the Javascipt files?”
The dirtiest solution is to manually combine them into one file. But the problem is you have to do it manually and have to migrate the changes occured in one file to the main file (main file referes to the combined Javascript file).
By writing the above code, you will be able to merge four external javascript files to one file.
In the above code two files are present in my project directory (i.e, jquery-1.4.1.min.js & Home.js) and the rest two files are the files which are useful when updatepanel is used. So for those files instead of giving the path, I have written the name of the Javascript file.
As the result of the above few lines, you will be able to get only one copy of the Javascript file. So instead of requesting for four javascript files, you will ask for only one javascript file.
And one more benefit is that, the composite javascript file will be gzipped, and you do not have to gzip the file by your own.
Hope this helps you.