Question

I'm just wondering if the placing of the html5shiv.js script load matters. All I know is that it must be in the <head> section of the page.

Does it need to come before all other scripts on the page? Does it make a difference if it is the first or last script loaded? Can it conflict with libraries if loaded before/after?

What is the optimal solution for page load times?

Was it helpful?

Solution

The html5shiv is a polyfill for html5 elements. As such it must be in your <head> and having it anywhere else defeats the purpose. It is meant to be run in the <head> before all your markup and only for IE less than version 9. This ensures it is able to make IE work properly. If you run it anywhere else bad things may happen. Here's how to load it:

<head>
....
<!--[if lt IE 9]>
<script src="html5shiv.js"></script>
<![endif]-->
...
</head>
<body>

Your Specific Questions

Does it need to come before all other scripts on the page?

Yes. This minimizes conflicts and weird issues in IE. For instance it creates unknown elements in the browser which subsequent scripts may need.

Does it make a difference if it is the first or last script loaded?

Yes. If it's loaded last other scripts may not benefit. For example their feature detects might detect non existing element and resort to slower alternatives.

Can it conflict with libraries if loaded before/after?

In most cases, I would say it's likely to cause conflict if you're loading something before it and that something tries to do something with the unknown html5 element.

In reality it depends what you're doing exactly! And what code you're placing there. You could write/have code that does or doesn't conflict with it and have it placed before. In general as long as you're not doing any DOM manipulation or hooking into anything, it should be fine. Test in IE and see.

What is the optimal solution for page load times?

Are you asking what the optimal page load time of your web page should be? If that is what you mean then my answer would be there isn't one because it keeps changing. I can tell you from experience though, you want your page to load in at no more than 2 seconds. But sometimes like in ecommerce sites for example, you might be making natuarally more heavier pages. Balance is key. Always test

I remember 5 or 6 years ago the average was between around 8 to 14 seconds and that was on DSL connection.

Would even go so far as to recommend that really popular and successful sites will need to try reaching that the 1 second mark more as people become more impatient and our access to technology gets more accessible.

OTHER TIPS

If you really want to speed up your script loading times, use RequireJS, which will load your scripts in parallel.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top