Re: [jQuery] Best Practices or unobtrusive Javascript
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
Re: [jQuery] Best Practices or unobtrusive Javascript
When doing dynamic sites, you sometimes have no choice but to put the JS in the body area. My rule of thumb is to use libraries wherever possible and include those libraries in the head section. But with the understanding that *sometimes* (though rarely these days) I will need to put JS into the body. Take a look at what you are doing with the code that is in the body area. Can that code be wrapped up in a function and called in the $(document).ready() function? If so, then that is probably what you should be doing to make your code more self contained. Building Ajax driven sites sometimes needs the code in the body area though. If you dynamically add a block of elements and need to do something to them the moment they are loaded, then this *might* be a reasonable time to embed JS code directly. Though I tend to use $.ajax() and so can just call a function after adding the elements. Which means I can pre-write that function in a library, with no JS needed in the body area. Clear as mud? :) Shawn breadwild wrote: 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 would be better for my content manager and the templating system if the Javascript *were* in the body but I don't want to be guilty of not having unobtrusive code. What's the standard/acceptable/best practices method? head script javascript here /script /head VS. body html here script javascript here /script /body Thanks in advance!
Re: [jQuery] Best Practices or unobtrusive Javascript
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
