For what is defer=“defer” in js?

Question

I'm messing around with Three.js. I discovered, that it only works in the following way:

<script src="script.js" defer="defer"></script>

But i don't know, why this defer="defer" is so important...

Can you help me?

Best regards Tobi P.

Answer 1

It causes the browser to defer parsing of the script (not necessarily delay loading).

Normally when the browser encounters a script tag, it pauses any further procesing of the HTML until the script has been downloaded, fetched, parsed (then compiled on most browsers) and executed. This is necessary to allow the javascript to inject html via document.write().

However this often means that the user is left looking at a blank screen for a long time.

With the defer tag, the script is not parsed/compiled until the HTML is fully loaded. If you have multiple script tags with the defer atrtribute, then the order in which they are parsed is maintained.

This is all extensively documented on the internet. The w3c pages are a good place to start (but can be a bit terse).