Могу ли я загрузить код JavaScript после загрузки остальной части страницы?

Question

У меня есть раздел веб-страницы, который загружает файл JavaScript из внешнего источника, а затем запускает Ajax-запрос.

Когда я загружаю страницу, я вижу браузер с надписью "waiting example.com"много, поэтому я думаю, что зависимость от этого внешнего JavaScript замедляет мою начальную загрузку страницы.

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

Answer 1

Хорошей практикой является размещение JS внизу, прямо над закрывающим тегом body. Кроме того, используйте события load window.onload или $(document).ready() для запуска JavaScript после загрузки страницы.

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

Ознакомьтесь с YSlow Guidelines для оптимизации интерфейса.

Answer 2

Вы можете использовать метод jQuery .getScript(), который является просто оболочкой для вызова AJAX.

http://api.jquery.com/jquery.getscript/

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

Answer 3

Я написал библиотеку для асинхронной загрузки файлов JavaScript с обратными вызовами, когда она загружается:

https://github.com/ssoroka/sigma

Sigma.async_script_load('http://example.com/underscore/underscore-min.js', '_', function() {
  _([1,2,3,2,3,1]).uniq();
});

Answer 4

Вы можете увидеть мой ответ здесь: Динамический (2 уровня) Загрузка Javascript / CSS

И возьмите скрипт из здесь (см. Источник). Используйте его внизу, и ваши скрипты не будут блокировать другие ресурсы (и если вы получили более одного, они будут загружаться в параллельном кросс-браузерном режиме).