Есть ли способ отложить загрузку некоторых модулей в jQuery и MooTools?

Question

Есть ли какое-либо встроенное решение отложить загрузку некоторых модулей после полной загрузки страницы и некоторых других необходимых модулей в jQuery и MooTools?

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

Я должен выбрать одну из этих платформ, и отложенная загрузка - один из моих важных приоритетов.

Answer 1

для mootools, вы можете использовать Asset.javascript от mootools-more.

например.

if (somelogic) {
    new Asset.javascript("somefile.js", {
        onload: function() {
            // call something defined / dependent on somefile.js being there.
        }

    });
}

Asset.js также может поддерживать отложенную загрузкуcss, image или images и может быть легко переписан для работы с множеством js-файлов, которые необходимо вводить последовательно.

Asset.javascripts = function(sources, options) {
    // load an array of js dependencies and fire events as it walks through
    options = Object.merge({
        onComplete: Function.from,
        onProgress: Function.from
    }, options);
    var counter = 0, todo = sources.length;

    var loadNext = function() {
        if (sources[0])
            source = sources[0];

        Asset.javascript(source, {
            onload: function() {
                counter++;
                options.onProgress.call(this, counter, source);
                sources.erase(source);

                if (counter == todo)
                    options.onComplete.call(this, counter);
                else
                    loadNext();
            }
        });
    };

    loadNext();
};

, которые я затем использую так (например, для ввода выбора даты)если еще не загружен):

if (!window.Picker) {
    new Asset.javascripts([
        "/js/mylibs/Locale.en-US.DatePicker.js",
        "/js/mylibs/Picker.js",
        "/js/mylibs/Picker.Attach.js",
        "/js/mylibs/Picker.Date.js"
    ], {
        onComplete: function() {
            new Asset.css("/js/mylibs/datepicker.css");
            new Asset.css("/js/mylibs/datepicker_dashboard/datepicker_dashboard.css");

            doDates();
        }
    });
}
else {
    doDates();
}

Answer 2

Вы можете сделать это в jQuery с getScript. Смотрите этот ответ: JQuery для динамической загрузки файла Javascript

Answer 3

Почему бы не загрузить ваши активы асинхронно?Для этого есть различные библиотеки скриптов.На данный момент я использую head.js .Вы можете установить ряд зависимостей и указать, какие модули загружать и когда.

Я склонен проверять наличие определенного элемента DOM перед загрузкой требуемого плагина - это имеет тенденцию ограничивать ненужную загрузку скриптов, т.е. скрипт галереи, занимающий полосу пропускания, когда на странице нет фактической галереи.