I use simple javascripts, jquery library and many plugins , should i make one file for all if yes then what we need to "just copy and paste and code from all file into one in needed order" or any thing else need to be considerd.
as stated here .html#num_http
Combined files are a way to reduce the number of HTTP requests by bining all scripts into a single script, and similarly bining all CSS into a single stylesheet. Combining files is more challenging when the scripts and stylesheets vary from page to page, but making this part of your release process improves response times.
and this .html#js_bottom
The problem caused by scripts is that they block parallel downloads. The HTTP/1.1 specification suggests that browsers download no more than two ponents in parallel per hostname. If you serve your images from multiple hostnames, you can get more than two downloads to occur in parallel. While a script is downloading, however, the browser won't start any other downloads, even on different hostname
It these are god practices then
Is it just same as i copy all css code from all files into one or it's tricky?
I use simple javascripts, jquery library and many plugins , should i make one file for all if yes then what we need to "just copy and paste and code from all file into one in needed order" or any thing else need to be considerd.
as stated here http://developer.yahoo./performance/rules.html#num_http
Combined files are a way to reduce the number of HTTP requests by bining all scripts into a single script, and similarly bining all CSS into a single stylesheet. Combining files is more challenging when the scripts and stylesheets vary from page to page, but making this part of your release process improves response times.
and this http://developer.yahoo./performance/rules.html#js_bottom
The problem caused by scripts is that they block parallel downloads. The HTTP/1.1 specification suggests that browsers download no more than two ponents in parallel per hostname. If you serve your images from multiple hostnames, you can get more than two downloads to occur in parallel. While a script is downloading, however, the browser won't start any other downloads, even on different hostname
It these are god practices then
Is it just same as i copy all css code from all files into one or it's tricky?
For each file you have, there are two steps :
If you reduce the number of files by bining them, you will reduce the number of HTTP requests -- which means your page will load a bit faster ;; which is good for your users ; which is why it's remended.
But this will make debuggig harder, which is why it's remended to do this only on your production environment, and not on the development platform -- hence the "making this part of your release process" part.
Of course, the process of bining your files content should not be done manually -- else, you'll have to re-do it each time there's a modification made ; it should be fully automated, and done at the time you are building the archive that is going to be deployed on your production server.
Also :
Ideally, you can use all three solutions, btw ;-)
Placing the <script> tags at the end of your page will :
This can help too -- but might be a bit harder to achieve than binaison+minification+pression.
There are several methods for improving javascript load performance.
Combine scripts into one file: I suggest only bining scripts you write/maintain yourself. Otherwise if the 3rd party library is updated it could be tough to update your bined file.
Use JSMin to reduce the size of javascript files, see http://www.crockford./javascript/jsmin.html.
Use Google's CDN for referencing JQuery and JQuery UI, see http://code.google./apis/ajaxlibs/documentation/, eg:
<script type='text/javascript' src='http://ajax.googleapis./ajax/libs/jquery/1.3.2/jquery.min.js'></script>
This avoids the user loading the file at all if their browser already has it cached.
For JQuery, you should be loading from Google. Since a lot of places use Google's JQuery, it's likely that it will already be cached and even potentially piled on the user's machine, which is about as good as one can possibly get. Cache beats all when it es to JS optimization.
If you're using one set of JS files across all the pages on the site, you can get a similar effect by bining them into one file and using it everywhere; the browser will load it on the first page the user visits and then the JS will be cached.
However, if each of your pages uses a different set of files, the cache benefits will be vastly reduced and in fact it may be counterproductive, since the browser will detect a+b.js as a different file and will load it even if a.js and b.js are already cached. Additionally, bining the files in the right configurations for each page is a non-trivial dependency-tracking problem. In short, it's more trouble than it is worth unless you're serving millions of unique hits per day, and even then it might not be a good idea.
In any case, minification and pression should always be applied in production, since they have basically no downsides.
