Я просто использовал плагин «Yslow» для Mozilla Firefox, и он сказал мне, что я должен поставить JavaScript внизу. Я слышал это раньше, но на самом деле не думал об этом слишком много. Действительно ли преимущество в том, что JavaScript находится внизу веб-страницы по сравнению с вершиной?JavaScript внизу/вверху страницы?
ответ
Это позволит веб-странице заметно загрузиться перед выполнением JavaScript, что имеет смысл для таких вещей, как Google Analytics, которые не должны произойти до загрузки страницы.
Возможно, вы также захотите изучить такие вещи, как jQuery, прототип и т. Д. И присоединить к «готовому» обработчику, который выполняет код JavaScript после полной загрузки DOM, что является подходящим местом для большого кода JavaScript.
Означает ли это, что JavaScript, который обычно находится в тегах
, может быть где угодно на странице после тега ? – userДа,
Да, страница загрузит контент и отобразит его перед загрузкой и выполнением javascript, и в результате загрузка будет быстрее.
Предполагая, что вы не работаете на CDN или не обслуживаете JS из отдельного поддомена или сервера, он будет загружаться синхронно и заставляет ваш HTML-контент ждать, пока он скачал файлы. Поместив JS в нижней части страницы перед закрывающим тегом </body>
, вы разрешаете анализ HTML до загрузки javascript. Это дает более быстрое время загрузки страницы.
Если у вас есть статическое содержимое html и много javascript, это может повлиять на воспринимаемое время загрузки страницы, так как загрузка html сначала даст пользователю что-то посмотреть. Если у вас мало javascript, или существующее содержимое страницы полагается на javascript, чтобы быть полезным, то это не так полезно практически говоря.
Я хочу принести обновление к этой теме, недавно недавно ввел асинхронный снимок http://support.google.com/analytics/bin/answer.py?hl=en&answer=1008080&rd=1, который может быть добавлен для вашего сайта, например. поддержка статистики Google. Он должен быть размещен внизу секции <head>
для обеспечения наилучшей производительности. Дело в том, что это увеличивает вероятность того, что маяк отслеживания будет отправлен до того, как пользователь покинет страницу.
Также он должен быть расположен там, если вы хотите проверить свой сайт в инструментах Google для веб-мастеров, используя свою аналитику google.
Кроме того, те же правила по-прежнему применяются в основном - javascript внизу для «быстрой» загрузки страницы. Я использовал кавычки, потому что я не считаю, что страница полностью загружена до тех пор, пока javascript не закончит ;-)
Это позволяет полностью заполнить элементы DOM, прежде чем загружать Javascript, который их обращается. Этот стандарт также является частью Visual Studio.
Размещение скриптов в нижней части элемента улучшает скорость отображения, поскольку компиляция скрипта замедляет отображение.
Вы можете перейти прямо к источнику на этом ... http: //developer.yahoo.com/performance/rules.html - это объяснение этой практики Yahoo. –
А если Javascript находится в отдельном файле? Я предпочитаю этот путь просто потому, что его легче отлаживать/читать. Является ли эта загрузка более быстрой/медленной? –
Являются ли эти правила производительности yahoo актуальными? Я должен представить, что кто-то опубликовал аналогично полный набор правил (или, возможно, опубликовал обновление yahoo), в котором учитываются изменения, произошедшие за последние четыре года. – kralco626