Задача Gulp занимает много времени, чтобы продолжить

Несколько примечаний:

  • s.async = true не очень корректно относится к HTML-типу HTML5, верно s.async = 'async' (фактически использование true является правильным, благодаря amn , которые указали это в комментарии ниже чуть ниже)
  • Использование тайм-аутов для управления порядком не очень хорошо и безопасно, и вы также увеличиваете время загрузки, сумма всех тайм-аутов!

Поскольку существует новая причина для загрузки файлов асинхронно, но в порядке, я бы рекомендовал немного более функционально-ориентированный путь по вашему примеру (удалите console.log для использования в производстве :)):

(function() {
    var prot = ("https:"===document.location.protocol?"https://":"http://");

    var scripts = [
        "path/to/first.js",
        "path/to/second.js",
        "path/to/third.js"
    ];

    function completed() { console.log('completed'); }  // FIXME: remove logs

    function checkStateAndCall(path, callback) {
        var _success = false;
        return function() {
            if (!_success && (!this.readyState || (this.readyState == 'complete'))) {
                _success = true;
                console.log(path, 'is ready'); // FIXME: remove logs
                callback();
            }
        };
    }

    function asyncLoadScripts(files) {
        function loadNext() { // chain element
            if (!files.length) completed();
            var path = files.shift();
            var scriptElm = document.createElement('script');
            scriptElm.type = 'text/javascript';
            scriptElm.async = true;
            scriptElm.src = prot+path;
            scriptElm.onload = scriptElm.onreadystatechange = \
                checkStateAndCall(path, loadNext); // load next file in chain when
                                                   // this one will be ready 
            var headElm = document.head || document.getElementsByTagName('head')[0];
            headElm.appendChild(scriptElm);
        }
        loadNext(); // start a chain
    }

    asyncLoadScripts(scripts);
})();

0
задан Patrick Kopp 13 July 2018 в 06:50
поделиться