Как правильно хранить javascript?

Question

[Andrew Chil]

Здравствуйте! Вопрос следующего типа!
Накопилось много javascript-a и jquery на странице ... Как правильно хранить его, чтобы нормально загружался сайт? Сейчас весь javascript разбросан в head-e и сайт заметно начал тупить. Или лучше вообще максимально отказаться от javascript-a и jquery?
Заранее спасибо )

Comments

[Алексей Уколов]

Что значит "сайт начал тупить" - медленно загружается или медленно работает?

[Алексей Уколов]

И при чем тут теги "php" и "css"?

[Andrew Chil]

Алексей Уколов: медленно загружается

[Andrew Chil]

Алексей Уколов: ни при чем, просто надо было чтоб больше людей ето увидело)

[Andrew Chil]

Извиняюсь, учту на будущее! Не знал что это важно так.

[Andrew Chil]

Анатолий K: Понял, каюсь)

Answer 1

[Anton Kuzmichev]

Отказываться не нужно, в наше-то время. Несколько общих рекомендаций:

• В head'е могут быть только самые необходимые скрипты, которым это нужно. Например, аналитика, счётчики, возможно что и jquery (просто по привычке его всегда в head'е прописываю)
  
• Остальные скрипты нужно убирать в самый конец страницы.
  
• Скрипты, как и стили, кстати, для ускорения загрузки надо сжимать и сливать в один файл
  

Answer 2

[Никита Гусаков]

Абсолютно все скрипты нужно засовывать в конец body. Если от скрипта не зависит ваше приложение (социальные кнопки, реклама) - добавлять атрибут defer.

Например, аналитика, счётчики, возможно что и jquery (просто по привычке его всегда в head'е прописываю)

Идиотская привычка.

Comments

[Adamos]

Один jquery в header-e на практике никак не отражается на скорости сайта, вообще-то. Он скачивается один раз и закеширован у пользователя на всю оставшуюся жизнь. А если он еще и берется с CDN - может и один раз не скачиваться.
Имхо, тормоза могут быть в двух случаях: когда на всех страницах навалено всего, что хоть где-нибудь используется на сайте или когда локальные скрипты страницы дико неоптимальны. И то, и другое нужно переделывать, а не оптимизировать.
А прочие камлания типа запихивания скриптов в конец body - это попытки подпереть костылями то, что не сумел сделать по-человечески.

[Никита Гусаков]

Adamos: Вы просто не понимаете, как работает браузер, видимо. Без JS пользователь увидит страницу, сможет прочитать контент. Все, что в head - блокирует парсинг и вывод DOM. Поэтому туда кладут стили. Стили должны подгрузиться до отображения DOM.

[Adamos]

А может, я просто представляю, как сайты облегчают AJAX-ом, включая тот страшный javascript раньше, чем контент вообще запрошен? И этот механизм внезапно работает у пользователя быстрее, чем статика с загнанными в подвал скриптами?

[Anton Kuzmichev]

Никита Гусаков: Ого как. А та же гугл-аналитика, загруженная в конце страницы, да еще и с defer - она вообще адекватная в итоге получаться будет? Ну там, статистика по времени загрузки страницы и всё такое?

[Никита Гусаков]

Adamos: может быть знаете. Но это явно не относится к топикстартеру, у него статика и скрипты.

[Никита Гусаков]

Anton Kuzmichev: гм, возможно вы и правы. Помимо этой статистики можно потерять статистику по отказам.

[Григорий]

Adamos: если скрипт расположен на стороннем ресурсе и помещён в head. При медленной отдачи данного скрипта сторонним ресурсом, браузер не будет отрисовывать страницу, пока не закончит с ним.
Соответственно, размещая такие скрипты в низ страницы, пользователь увидит содержимое сайта до окончания его загрузки. Сталкивался с таким поведением, когда 2gis тупил с его картами. Скрипт отдавал, но очень долго. В итоге пользователи начинали говорить что наш сайт очень долго открывается.

[Adamos]

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

Answer 3

[FanatPHP]

Лучше сначала разобраться - что именно стало "тупить" и насколько конкретно "заметно".
Без этого разговор не будет иметь смысла. А любые советы будут бессмысленным повторением шаманских заклинаний