Как загрузить JS файл через какой-то интервал времени?

Question

[Михаил Петров]

Приветствую!

Столкнулся с такой проблемой.
Одностраничный онлайн сервис на AngularJS.
В первые 10-15 секунд после загрузки идёт очень активное взаимодействие с сервером -
работает JS, загружает необходимые для отображения данные.
Поставил Живосайт. Он начинает загрузку одновременно с моими запросами.
Крайне важно, чтобы JS максимально быстро получил всё что нужно от сервера. А ему под ногами путается Живосайт со своей загрузкой.

Нужно чтобы Живосайт начинал загружаться через 15-20 секунд после загрузки всех компонентов.
Такое возможно?
Спрашиваю не как специалист. Дабы программисту ткнуть в ссылку или ваш ответ и сказать "сделай так".

Answer 1

[Сергей Мельников]

function loadScript(src) {
  var s = document.createElement('script')
  s.src = src
  document.body.appendChild(s)
}

// и дальше в нужном месте вызываем
loadScript('path/to/my/script.js');

// или по таймауту
setTimeout(function() { loadScript('path/to/my/script.js') }, 15000);

Comments

[Никита]

в дополнение к ответу, порекомендую посмотреть на lazyload если нужно не только лениво js загружать.

[Алексей П]

Можно так же использовать Modernizr

Modernizr.load({
load: [
'https://ajax.googleapis.com/ajax/libs/jquery/1.7.1...',
'https://ajax.googleapis.com/ajax/libs/jqueryui/1.8...'
],
complete: function () {
if ( !window.jQuery ) {
Modernizr.load(
load: [
'js/plugins/jquery-1.7.1.js',
'js/plugins/jquery-ui-1.8.16.js'
],
complete : function(){
//some action
});
} else {
//some action
}
}
});

[Михаил Петров]

Благодарю всех! Хорошего дня!

Answer 2

[Kano]

Вариант с использованием функции setTimeout как костыль вполне подходит для решения вашей задачи, но унего есть недостаток он срабатывает всегда через определенный интервал времени вне зависимости от скорости загрузки всех компонентов у пользователя (повторная загрузка страницы будет быстрее т.к все компоненты будут загружены из кеша.
Есть второй вариант (более продвинутый) - загрузка после решения всех зависимостей открываемой страницы.
Для этого надо в старте приложения (в теле функции run в файле app.js где связываются контроллеры с адресами страниц) подписаться на событие у

var off=$rootScope.on("$stateChangeSuccess",function(){})

или на событие

var off=$rootScope.on("$routeChangeSuccess",function(){})

в зависимости от того используете ли в вашем приложении ui.route или ngRoute для связывания путей с контроллерами.
В теле функции-обработчике сначало отписывайтесь от события (чтобы дважды не грузить живосайт) off()и грузите живосайт

Answer 3

[Никита Баев]

Через $timeout делать инициализацию можно, но она также может начаться в момент лоадинга других запросов. Можно по колбэку, когда все запросы отработаны подгружать jivosite.

Answer 4

[Алексей П]

$scope.$watch(function() {
    return $http.pendingRequests.length;
}, function(newVal) {
    if (newVal === 0) {
      (function loadScript(src) {
         var scriptElement = document.createElement('script');
         scriptElement.src = src;
         window.document.head.appendChild(scriptElement);
      })("/path/to/script/");
    }
});

ну и несколько картинок

код

создан элемент и попытка загрузить скрипт

элемент в дереве

Answer 5

[Александр Прозоров]

Ссылку не дам, но можно покопать в сторону использования комбинации setTimeout() и JQuery метода .getScript()

Answer 6

[Михаил Петров]

Вот что ответила поддержка Живосайта:
1) Вам нужно обернуть наш скрипт в setTimeout
2) admin.jivosite.com - настройки - опции - перезагружать (включить),
3) В октябре будет обновление, которое не будет блокировать загрузку window