The blocking is an issue, but only if you end up loading more than XXX
number of elements at a time. The specific number is browser dependent.
I think I read somewhere that IE8 and FF3.5 will only load 4 items
concurrently (CSS files, JS libraries, images, etc).
So, the knee-jerk solution is to minimize your libraries, compress them
where possible, enable caching, etc. OR, load a single JS library that
will then add the needed elements after the page loads.
Sure putting JS at the end of a file, or even in the middle of the file
may help with performance, but I would slap my subordinates upside the
head (in a friendly manner, of course) for doing that. It makes
maintaining pages a pain in the rear, seeing as every other page I've
worked on in recent years puts JS in the header (either library
includes, or page specific code), AND is contrary to the coding
standards for our projects. Writing code that is generally consistent
with what others tend to do makes that code much easier to understand
and maintain.
But I recognize the "many ways to do things" rule, and don't mean to
suggest "my way is right". If you have the volume where you *really*
need to worry about performance, then the rules get bent anyways and
creative solutions are found. Such as merging all JS libraries into one
file, then gzipped....
My random thoughts.
Shawn
Rafał Pocztarski wrote:
2009/11/30 breadwild <breadw...@gmail.com>:
I have seen several examples on jQuery plugin sites that have the
<script> tag and Javascript within the <body> and not the <head> where
I thought it was supposed to go.
It's a matter of performance. Put your CSS as close to the top of the
<head> as possible, and put your JavaScript as close to the bottom of
the <body> as possible.
This is because browsers try to load everything in parallel but block
while loading, compiling and executing JavaScript (because it could
potentially alter the following HTML - e.g. using document.write). You
can try to work around this but if you just want to include <script>
tags in your HTML without any fancy tricks to load scripts using
iframes or xhr evals or injections then move your <script> tags to the
bottom of your page.
Rafał Pocztarski
