JSBasics: Antiquated recommendation for <script> position in html doc

MDN
#1

Hello, I went through the JavaScript Basics MDN tutorial about a week ago. One of the orange boxes (don’t know how these are properly called :P) gives the following advice;

Note: The reason we've put the <script> element near the bottom of the HTML file is that HTML is loaded by the browser in the order it appears in the file. If the JavaScript is loaded first and it is supposed to affect the HTML below it, it might not work, as the JavaScript would be loaded before the HTML it is supposed to work on. Therefore, putting JavaScript near the bottom of the HTML page is often the best strategy.

Today, I found this Stackoverflow topic, where in the top answer it’s argued that the above is antiquated advice: https://stackoverflow.com/questions/436411/where-should-i-put-script-tags-in-html-markup

The advice from the MDN guide seems simpler, but I feel convinced it isn’t the optimal practice in modern web development. Since the orange boxes contain practical tips, I don’t believe it would be unreasonable to replace the current advice with the standard practice articulated in the Q&A topic. Thoughts?

Off topic: Probably should have used an anchor to the box instead of quoting, don’t yet know how to do that. If you know of some good how-to, please share.

#2

Hi there,

Yeah, I think you are right. When I originally wrote the beginner’s JS material, I wanted to keep things as simple as possible for beginners, and make sure there was as little chance as possible that they come across code that their browser doesn’t support.

However, I think we have got to the point now where teaching the modern JS stuff is as simple or simpler than the old techniques, and it is supported in most places. Teaching the modern way and then having techniques for supporting older browser if required as a later more advanced topic makes more sense than the other way round.

To this end, I have written a plan to start updating a bunch of our tutorial content to reflect this in 2018. You can find and comment this doc here:

I will add add this point you are making to make sure it gets done soon. Thanks for bringing it up!