Почему JavaScript подключают перед закрывающим тегом body?

Несколько лет назад все подключали скрипты между <head></head> сейчас заметил, что многие разработчики подключают свои скрипты перед закрывающим тегом </body>.

Вопрос, почему?
  • Вопрос задан
  • 6171 просмотр
Пригласить эксперта
Ответы на вопрос 4
alexey-m-ukolov
@alexey-m-ukolov Куратор тега JavaScript
Браузер останавливает парсинг страницы, когда встречает тег script. Поэтому, чтобы пользователь увидел контент как можно раньше, подключение скриптов откладывают на самый последний момент.
Принципы работы современных веб-браузеров
Ответ написан
Чтобы не задерживать загрузку страницы, размещают скрипты внизу страницы, прямо перед закрытием тэга
Ответ написан
Комментировать
@artemsee
Браузер рендерит страницу сверху вниз, в случае когда скрипты располагаются в теге <head> рендеринг останавливается для того, что бы браузер скачал эти скрипты и затем продолжает работу, для некоторых сайтов эта задержка чувствительная, в таком случае предпочитают сначала вывести контент сайта, а затем подгрузить скрипты.

Так же существует еще один кейс, правда не очень правильный, когда какая-либо функция скрипта, работает с DOM-элементами сайта. Когда, его подключают сверху эта функция будет пытаться обратится к DOM-элементу который еще не отрендерил браузер, что вызовет ошибку. На примере jQuery это обычно решается с помощью обертки функции в $(document).ready(), можно отказаться от этой обертки, перенеся подгрузку скрипта в самый конец страницы, это гарантирует нам, что DOM будет отображен когда дело дойдет до загрузки скрипта.
Ответ написан
@uniquenicknqame
Почитайте вот тут:
https://learn.javascript.ru/external-script
если лениво всю статью, то хотя бы раздел "Асинхронные скрипты: defer/async"
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы