Клиентские скрипты в "head" или "body"

Не так давно, я начал использовать CSS фреймворк Bootstrap, который в комплекте имеет более десятка дополнительных JavaScript скриптов.

Разработчики из команды Twitter, рекомендуют подключать их в конце страницы, перед закрытием тега "body", мотивируя это тем, что так страница будет загружаться быстрее.

При подключении скриптов в конце страницы, вначале строиться и отдается пользователю html+css версия страницы, а только потом она "оживляется" подключением скриптов. Так, при использовании динамических эффектов из того-же Bootstrap (скрипта модальных окон, выпадающего меню, и т.п.), до полной загрузки страницы события обрабатываться не будут.

Даже не проводя тестов по скорости, а только по наличию такого совета, можно предположить, что в некоторых условиях, время необходимое на подключение всего комплекта скриптов, может быть достаточно значительным, а значит и вероятность потерянных событий велика.

А вы уверены, что нажав на элемент навигации, который должен открыть модальное окно, и не увидев его, посетитель догадается что нужно некоторое время подождать, и нажать ещё раз? А когда он не дождется, и нажмет на такую ссылку (с адресом href="#"), то будет перезагрузка страницы.

Интернет все больше становится мобильным, а реальная скорость загрузки страниц на мобильных устройствах оставляет желать лучшего. Отдавать посетителю заведомо нерабочую страницу, на мой взгляд, хуже, чем заставить его некоторое время подождать её полной загрузки. Тем более, что те у кого медленный интернет, ждать уже привыкли.

Я продолжаю подключать почти все скрипты в секции "head", чего и вам советую.

09.04.2012