Javascript Ladereihenfolge ???

Hallo zusammen,

hat einer eine Idee, warum die Ladereihenfolge folgender Script immer gleich, aber falsch ist?

bindReady(function() { OnloadScriptLoader("/addons/fader/fader-20151204.js", "true", init_fader); });
bindReady(function() { OnloadScriptLoader("/slide.js", "true", init_BSS); });
bindReady(function() { OnloadScriptLoader("/addons/gmap/map-20160518-min.js", "true"); });
bindReady(function() { OnloadScriptLoader("/addons/lightbox/js/lightbox-20160109.js", "true"); });
bindReady(function() { OnloadScriptLoader("/addons/socialbutton/js/socialbutton-20151123.js", "true"); });
bindReady(function() { OnloadScriptLoader("/addons/cookieconsent/cookieconsent-20151128-min.js", "true"); });
bindReady(function() { OnloadScriptLoader("/addons/piwik/piwik.php", "true", init_piwik); });

Mir ist klar, dass asynchrones Nachladen nicht unbedingt die Reihenfolge sein muss, wie man sie vorgibt, aber das ist doch etwas sehr auffallend.

Die Reihenfolge ist eigentlich exakt so, wie die Aufrufe da stehen. Nur Piwik kommt komischerweise zuerst. Und das immer. Gibt es dafür eine plausible Erklärung, warum das größte und langsamste Script immer als erstes geladen wird, obwohl ich es eigentlich so spät wie möglich will?

Erklärung: bindReady prüft eigentlich nur, wann der DOM vorhanden ist, also im besten Fall, wann "DOMContentLoaded" gefeuert wurde. Ist das nicht vorhanden, dann eben wenn "readyState" da ist oder als letzter Fall, wenn "load" gegeben ist.

OnloadScriptLoader: Das hängt die Scripte dann ein, alle gleich und ruft, wenn nötig, die Callback-Funktion auf.

Wie gesagt, das geht alles. Nur dass Piwik immer als erstes geladen wird macht mich irgendwie kirre.

Das könnte sein Alex. Ich weiß zwar noch immer nicht, warum das so ist, aber ich weiß nun, wie es passiert. Und hier könnte es durchaus Unterschiede bei den Browsern geben. Ich rede hier vom Firefox. Ich kann noch nicht mal sagen, ob das schon immer so war, glaube aber eher nicht. Ich nutze diese Art des Aufrufs ja schon 6 Jahre und das ist mir noch nie aufgefallen.

Das Einzige, was bei Piwik anders ist, das Script wird angefordert und Piwik liefert einen Status 304.

Alle andere Scripte arbeiten mit Expires und kommen somit aus dem Browsercache. Und genau hier passiert es.

Egal wie die Reihenfolge der Aufrufe ist, die Files, die im Browser-Cache liegen, kommen immer zuletzt, aber so wie angefordert. Alle anderen, die nicht im Cache sind, kommen davor, egal ob die dann einen 200 oder 304 senden.

Wenn ich Piwik auch ein Expires gebe, dann reiht es sich korrekt ein und die ganzen Files werden in genau der Reihenfolge geladen wie angegeben.

An sich hört sich das ja logisch an, so nach dem Motto, "das Ding kenne ich nicht, also lade ich das mal zuerst, dauert ja länger und das andere hole ich mir danach parallel aus dem Cache". Rechnerisch macht das Sinn! In Sachen Piwik aber nicht, weil direkt danach das Tracking kommt (also auch zu früh) und das noch länger dauert.

Also gerade in Sachen Ladezeit. Expires ist ohnehin besser als 304, aber durch Expires und den Browser-Cache ändert sich auch die Reihenfolge, was wie z.B. bei Piwik, sogar negativ sein kann. Ich sehe es z.B. auch beim Adsense-Script. Obwohl das asynchron geladen wird erfolgt der Abruf vor allen anderen Dateien, da Google eben auch nur mit 304 und nicht mit Expires arbeitet.

Und das auch ohne den Scriptloader, sondern einfach mit <script async src="">, also genauso wie Adsense. Meine Scripte, die im Cache liegen, werden nach Adsense ausgeführt, obwohl im Quelltext früher aufgerufen.

Kannste den Satz bitte mal erklären? Verstehe da den Zusammenhang zwischen "vorher" und "nach anderen" nicht

Zitat

welches ich vorher haben wollte nach Ausführung aller anderen Sachen, die ich haben will.

Deine Anmerkung mit dem 304. Das habe ich nun ja so in etwa. Ein extra Script braucht es nicht, denn es ist ja schon eines bzw. zwei extra. Noch eins ist zu viel

Bisher ist der Ablauf ja komplett gesagt so:
Wenn DOMContentLoaded oder Load gefeuert wurde, dann piwik.php asynchron einbinden. Diese Piwik.php ist ja der offizielle Piwik-Proxy. Der seinerseits prüft den HTTP_IF_MODIFIED_SINCE und wenn der älter als 24 Stunden ist, dann ruft der Proxy das eigentliche JS vom Piwik-Server ab.

Wenn älter als HTTP_IF_MODIFIED_SINCE, dann gibt der Proxy das JS zurück. Wenn jünger, dann meldet er 304.

Das habe ich nun so abgeändert, dass der, egal ob älter oder jünger als HTTP_IF_MODIFIED_SINCE, immer einen Expires von 30 Min mitsendet, der Browser quasi nur noch alle 30 Minuten auf den Proxy zugreift und der dann je nach eigener Entscheidung, einmalig einen 304 oder das JS ausliefert, beides wieder inkl. Expires.

Also das habe ich soweit gelöst. Mir ist aber das Verhalten gänzlich neu. Gut, habe mir das das letzte mal vor gut 1,5 Jahren so ausführlich angesehen, aber da war das sicherlich nicht, das hätte ich bemerkt. Und wenn ich nun mal Rückschlüsse auf diese ganzen Google-Tools ziehe, dass man hier und da was asynchron laden und cachen (expires) soll, dann hat das irgendwie einen faden Beigeschmack. Je mehr man Expired, desto früher wird Adsense geladen ....

Aber wie gesagt, ich kannte dieses Verhalten vom Firefox bis gestern nicht.

Der Witz an der Sache ist ja vor allem noch, wenn man mit 304 arbeitet, dann ist das für Insights kein Problem. Setzt man aber einen Expires von einem Tag oder kleiner, dann kommt eine Warnung.

Zitat

Legen Sie für Expires mindestens eine Woche fest, vorzugsweise bis zu ein Jahr. Wir bevorzugen Expires gegenüber Cache-Control: max-age, weil es breiter unterstützt wird

Klar, merkt man ja, darum hat Adsense ja auch einen Wert von 10 Minuten und Maps 60 Minuten.