Как показывать порядок груза асинхронных scripts

У меня есть Веб приложение, которое загружает несколько файлов языка сценариев JavaScript следующего способа (упрощенная, в действительности у меня есть 8-10 файлов):





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

Например, codigo4.js используй информацию, которая загружается в codigo1.js и codigo2.js. Но codigo1.js - файл достаточно большой, чем codigo4.js, из-за которого, если я загружаю scripts асинхронного способа, мог бы встречаться случай, что codigo4.js работал, нежели codigo1.js.

Есть какой-то способ использовать defer или async но поддерживая порядок выполнения, показанный в коде? Какие альтернативы у меня есть?

7
задан 20.09.2016, 16:37
3 ответа

Используй defer:

Перевод, свободный от especificiación:

Есть три возможных способа, если он выбирает async рукописный шрифт работает асинхронной формы, так скоро будьте доступен (загруженный). Если он не определен async но если defer рукописный шрифт выполнен, закончив parsear страницу. Если ни один из признаков не присутствует, рукописный шрифт загружается синхронной формой прерывая parseo страницы.

Потом, как объясняет в точке 15 (упрощенный перевод)

Если элемент имеет src и defer и у него нет признака async, Рукописный шрифт arega в конце списка scripts, который будет выполнен, когда закончится parsear документ.

Это значит, что scripts с defer они работают, после грузя и parsear страница и в порядке, который они находятся в DOM, что решает твою проблему зависимостей.

Думай об этом как очередь <script> что работают, когда заканчивается parsear html.

8
ответ дан 24.11.2019, 13:21
  • 1
    Гениальный, и спасибо за помещение ссылки especificaci и # 243; n чиновник. Он смотрел он-лайн и кажется, что он может не удаваться в IE9 и предыдущие, но действительно мне не важно, потому что я не даю опору этим браузерам. – Alvaro Montoro♦ 20.09.2016, 17:49

Уже они дали тебе ответы, однако я предлагаю тебе альтернативу использования удивительного книжного магазина require.js. Выбери, когда загружать твои файлы, вместо того, чтобы загружать все их одновременно.

Избеги писать столько этикеток <script> в документе html, это является совсем не профессиональным. Программа модульного и организованного способа. Совсем в Вашем должном месте и своевременно.

Одинокой является мое смиренное мнение и рекомендация. Больше информации здесь.

4
ответ дан 24.11.2019, 13:21

Прежде всего, важно, что добавлять кодирование UTF-8 в файлы javascript. Это для того, чтобы он вынес тильды, á é í ó ú, например, вместо codigo, он будет código.

<meta charset="utf-8" ></meta>

Следующее решает проблему scripts, которые зависят от других. Идея состоит в том, чтобы файлы, которые зависят от другого, не присоединились в html, но нужно добавлять другой файл в списке scripts.

Например, здесь он не загружается codigo2.js, только нагрузи codigo1.js, и кроме того esperador.js, что должен быть сначала, возьмется за то, чтобы загружать первого.

<script src="esperador.js"></script>
<script src="codigo1.js"></script>

То, что он делает, состоит в том, чтобы ждать второй способ, в который он загружал бы переменную первого файла, codigo1.js, эта переменная должна быть заблаговременно объявленной, в моем случае он называется variable_código1_js.

Контент файла esperador.js.

function cargarCódigo(archivo)
{
    var código = document.createElement("script")
    código.src = archivo
    código.onload = function(){this.remove()}
    document.head.appendChild(código)
}
function esperarDependencia()
{
    if(variable_código1_js)
    {
        cargarCódigo("codigo2.js")
    }
    else
    {
        setTimeout(esperarDependencia,500)
    }
}
esperarDependencia()
3
ответ дан 24.11.2019, 13:21