4 Replies - 937 Views - Last Post: 17 May 2013 - 03:00 PM

Best way to optimize load time?

Posted 17 May 2013 - 10:58 AM

Hi all,

I'm using JQuery and the JQuery UI in my site, and by far they are the biggest part of it -- together, they're about 300 KB. So far, I've only needed to make very small Javascript files that use them -- right now they have a total size of about 3 KB, 1 KB per file approximately. I will definitely be adding more Javascript to my site, but I doubt I'll end up with 300 KB or more of Javascript that I wrote myself.

So -- Both JQuery and JQuery UI will almost always be used on my site, with all pages. The small files I make will mostly be page-specific, for little effects and the like, although there will probably be a few that all pages will use.

I make sure to comment the Javascript files that I write very carefully; I always have a block of comments at the top of the file to make sure there's no way to misinterpret anything, and they can at times be as big as the code itself. (When the code itself is 4 or 5 lines, though, it doesn't exactly make a difference when you look at it in a text editor.)

Anyway, because of the comments I write, all my custom Javascript files are about twice as big as they need to be. They're still just over 1 KB at max each, but the comments do cause bloat in the file.

After doing some research, I'm trying to figure out the best way to handle this -- is it a better idea to just always load the JQuery and JQuery UI, then load in the small Javascript files where needed, or would it be better to concatenate them all into one file (removing comments first), remove the overhead of reading multiple files, and just have it load the extra Javascript all the time?

The crux here is that I don't know which is more significant when it comes to slowing down load time -- file reading overhead or the size of the files themselves. It seems like it depends, from my research, but it would be nice to know if there actually is a best practice here that I could follow. I've also heard that you can compress Javascript, but I'm not sure I understand how the browser would be able to read the Javascript then, if it was a tar file for example.

Would anyone be willing to offer me some advice on best practices for this, please? I'd appreciate any information, and thanks for getting through my long-winded rambling.