Verwenden Sie Pace.js, um dynamisch geladenes Skript nachzuverfolgen.

Question

Ich verwende pjax standalone und pace.js, um den Seitenladefortschritt anzuzeigen. Alles funktioniert gut.

Allerdings habe ich ein Skript, das ich dynamisch nach einem Klick auf die Schaltfläche laden, die ziemlich groß ist (houndify-web-sdk.min.js 700kb) und möchte den Fortschritt dieser Last auch zeigen.

Das Skript zur Zeit wie folgt wird hinzugefügt:

var newScript = document.createElement("script"); 

newScript.setAttribute("src", "/js/large-script.min.js"); 
document.body.appendChild(newScript); 

Ist es möglich, Tempo zu bekommen diese Last zu verfolgen?

Ich habe auch die folgende Pace.track-Funktion ohne Glück versucht.

Pace.track(function() { 
    var xhr = new XMLHttpRequest(); 
    xhr.open("GET", "http://large.min.js", true); 
    xhr.responseType = "text"; 

    xhr.onload = function() { 
    if (this.status === 200) { 
     console.log("loaded"); 
    // not sure how I would then put the response into a script src file 
    } 
    }; 
    xhr.send(); 
}); 

Jede Hilfe/Beratung sehr würde sehr geschätzt!

Answer 1

Wenn jemand anderes Probleme damit hat - mit jQuery.getScript() funktioniert gut. Um das Caching zu aktivieren, gehen Sie folgendermaßen vor:

$.ajax({ 
    url: url, 
    dataType: "script", 
    success: success, 
    cache: true 
});