Подтвердить что ты не робот

Устанавливает ли скрипты в нижней части веб-страницы скорость загрузки страницы?

Лучшие практики Yahoo заявляют, что размещение файлов JavaScript внизу может ускорить загрузку ваших страниц. Каков опыт этого? Каковы побочные эффекты, если они есть?

4b9b3361

Ответ 1

Он имеет несколько преимуществ:

  • Рендеринг начинается раньше. Браузер не может использовать элементы макета, которые он еще не получил. Это позволяет избежать проблемы "белого белого экрана".

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

Ответ 2

Насколько я могу судить, он просто позволяет браузеру начать рендеринг раньше.

Ответ 3

Если вы получаете копию Microsoft Visual Round Trip Analyzer, вы можете точно профилировать то, что происходит.

То, что я видел чаще всего, заключается не в том, что большинство браузеров STOP PIPELINING запросов, когда они сталкиваются с файлом JavaScript, и посвящают все свое соединение загрузке одного файла, а не загрузке параллельно.

Причина, по которой конвейерная остановка прекращена, заключается в немедленном включении script в страницу. Исторически, многие сайты, используемые для использования document.write для добавления контента, а загрузка script сразу же позволили получить немного более бесшовный опыт.

Это, безусловно, поведение, которое Yahoo оптимизирует. (Я видел ту же рекомендацию в журнале MSDN с приведенным выше объяснением.)

Важно отметить, что IE 7+ и FF 3+ ​​с меньшей вероятностью демонстрируют плохое поведение. (В основном с тех пор, как использование document.write вышло из практики, и теперь есть более эффективные методы предварительного рендеринга контента.)

Ответ 4

Один побочный эффект будет заключаться в том, что некоторые скрипты не работают вообще, если вы поместите их в конец страницы. Если выполняется script во время рендеринга страницы (например, для скриптов объявлений), которая полагается на функцию в другом script, сначала нужно загрузить script.

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

Ответ 5

Помещение их внизу - это близкий эквивалент использования атрибута "defer" (даже больше информации здесь). Это похоже на то, как браузер не может продолжать компоновку страницы, если IMG-теги не имеют информации о ширине и высоте - если включенный javascript генерирует контент, тогда браузер не может продолжить компоновку, пока не узнает, что там есть, и насколько велика все.

Пока ваш javascript не должен запускаться до события onload, вы должны либо поместить теги script в конце, либо использовать атрибут defer.

Ответ 6

Ваша страница должна загружаться быстрее. Браузеры откроют несколько подключений, чтобы загрузить, например, три изображения параллельно. С другой стороны, теги <script> в большинстве браузеров заставляют браузер блокировать выполнение этого script. Если его тег <script> с атрибутом src, браузер блокирует загрузку и выполнение. Если вы положите теги <script> в конце, вы избежите этой проблемы.

В то же время это означает, что эти страницы не имеют функциональности JS, пока они не будут загружены. Хорошее осуществление в доступности - обеспечить, чтобы ваш сайт работал достаточно хорошо, чтобы его можно было использовать до тех пор, пока JS не загрузится. Это гарантирует, что страница будет (а) работать хорошо для людей с медленными соединениями (b) хорошо работать для людей с нарушениями или использовать текстовые браузеры.

Ответ 7

если вы разрабатываете для firefox/safari, вы всегда можете проверить с помощью панели firebug/developer, поскольку они показывают последовательность загрузки файлов

Ответ 8

Есть несколько точек.

  • Он загружает страницу быстрее, поскольку внутренний или внешний JavaScript находится внизу.

  • Если вы не использовали метод окна onLoad в JavaScript, он начнет выполнение сразу после его рендеринга. Script внизу гарантирует, что ваш Script будет выполняться после загрузки страницы.

  • Если Script является файлом, значит, он будет отображаться после изображения HTML и другого визуального объекта, который формирует представление страницы.

Если вы используете fireFox, то для проверки производительности есть плагин. Пожалуйста, удалите сайт firefox для этого плагина.