I am about to embark on a new web project and I plan to put some JavaScripts in the <head>
and also some before </body>
, using the following scheme:
Scripts that are essential for the UX of the page: in the
<head>
. As I've picked up perusing the web - scripts in the<head>
is loaded before the page loads, so it would make sense to put scripts that are essential to the user experience there.Scripts that are non-essential to the design and UX (Google Analytics scripts etc.): before the
</body>
.
Is this a sensible approach?
Another approach would be to put all the scripts in the <head>
and add defer attributes to the non-essential scripts. However, I read that older versions of Firefox don't pick up the defer attribute.