Question

为了提高性能，有许多方法可以异步加载JavaScript，如SO post.

所示

但是，通常情况下，如果需要，这些方法不会保留顺序，例如依赖项。

您可以通过哪些方式获得异步加载的好处，还可以在需要时保留订购。

Backbone依赖是一个很好的例子。

（require.js，jquery.js） - ＆gt; Backbone.js的

是否有可以从库中获得的Promises或队列的实现来实现这一目标？

head.js似乎不使用promises或队列。

Answer 1

简易解决方案：使用Promises。 jQuery中的.ajax提供了版本1.5的承诺。

如果您不能使用第三方库，您可以执行以下操作：

var resourceData = {};
var resourcesLoaded = 0;

function loadResource(resource, callback) {
    var xhr = new XMLHttpRequest();
    xhr.onload = function() {
        var state = this.readyState;
        var responseCode = request.status;

        if(state == this.DONE && responseCode == 200) {
            callback(resource, this.responseText);
        }
    };

    xhr.open("get", resource, true);
    xhr.send();
}

//Assuming that resources is an array of path names
function loadResources(resources) {
    for(var i = 0; i < resources.length; i++) {
        loadResource(resources[i], function(resource, responseText) {

            //Store the data of the resource in to the resourceData map,
            //using the resource name as the key. Then increment the
            //resource counter.
            resourceData[resource] = responseText;
            resourcesLoaded++;

            //If the number of resources that we have loaded is equal
            //to the total number of resources, it means that we have
            //all our resources.
            if(resourcesLoaded === resources.length) {
                //Manipulate the data in the order that you desire.
                //Everything you need is inside resourceData, keyed
                //by the resource url. 
                ...
                ...
            }                    
        });
    }
}

Answer 2

尝试实施和使用Combres库。

https://www.nuget.org/packages/combres

装货订单只是众多好处之一。缩小，css变量，在路径中使用tilda（比如在asp.net中）等等只是一些好处，以及组合和缓存。

图 - 实现有序的异步脚本加载？

2 个答案: