Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Merging multiple javascript files

I've read that merging several multiple javascript files into a single file improves performance, is that true?

If so, is there an easy and error-free way of merging them, or perhaps an online-tool that automatically does that?

Many thanks.

like image 735
eozzy Avatar asked Dec 23 '09 02:12

eozzy


3 Answers

See Multiple javascript/css files: best practices? and Supercharging Javascript in PHP.

The short answer is that you want to minimize external HTTP requests. The best way to do that is to force the browser to cache files you server until they change. You do this by versioning the files and providing a far future Expires header. When the filename changes (by changing the version) the browser will get the new version.

If you do this then multiple Javascript files don't really matter. But if you force the client to download 27 JS files on each and every page with no caching then reducing the number of files can make a substantial difference. Of course this is still inferior to effective caching/versioning strategies.

Another more recent issue to consider is iphone caching:

iPhone will not cache components bigger than 15K (was 25K in the previous experiment)

So in some circumstances combining files can be detrimental.

like image 130
cletus Avatar answered Oct 19 '22 08:10

cletus


If you have many javascript files, it can help to combine them and to minify them. By combining them into a single file, you reduce the number of connections and files that need to be downloaded from your site. By minifying them, you actually reduce the size of the files by removing white space, comments, and so forth. Take a look at JSMin and YUI Compressor.

Edit: As other commenters indicate, combining files really only makes sense if users are actively using features from all the files. It wouldn't make sense to combine a large and rarely used javascript file in with all your commonly used functions.

like image 41
Tauren Avatar answered Oct 19 '22 08:10

Tauren


You can also take a look at http://jscompress.com/, a online JavaScript compression tool.

like image 3
Mamut Avatar answered Oct 19 '22 09:10

Mamut