Viele Seiten setzen inzwischen ziemlich viel Javascript ein. Das kann dazu führen, dass die Seite länger braucht, um angezeigt zu werden. Zum einen, weil eine relativ große Datenmenge heruntergeladen werden muss (leitungsabhängig), zum Anderen, weil das gesamte Script auch noch interpretiert werden muss (hardware- und browserabhängig).
Ich habe begonnen, den Großteil meiner Scripte erst nachzuladen, wenn die Seite fertig gerendert ist. Zum Glück kommt inzwischen oft jQuery und Google-maps zum Einsatz, so dass sich anbietet, den google-Ajax-Loader zu verwenden.
… und die eigenen Scripte?
Beim konsequenten Einsatz von jQuery sollten die eigenen Scripte eigentlich vernachlässigbar kurz sein ;P.
Kommt dennoch mal mehr Code zum Einsatz, könnte man eigentlich auch mehr nachladen. Aktuell sind das bei uns zum Beispiel das Adserverscript, das Statistikscript und unsere eigenen Scripte. Hier wiederum bietet sich an, nur ein winziges Javascript gleich im Seitenkopf einzubetten:
var loadAnyScript = function(url){
var head = document.getElementsByTagName("head")[0];
var script = document.createElement("script");
script.src = url;
script.type = "text/javascript";
head.appendChild(script);
script.onload = function(){
head.removeChild(script);
}
};
Für mehrere Scripte bietet sich an, das Ganze noch ein Wenig zu pimpen:
var speedingUpJs = {
scripts: ["/sript1.js", "script2.js", "http://url1.de/script.js"],
init: function() {
for each (script in this.scripts)
this.loadAnyScript(script);
// die restliche Initialisierung
},
loadAnyScript: function(url){
var head = document.getElementsByTagName("head")[0];
var script = document.createElement("script");
script.src = url;
script.type = "text/javascript";
head.appendChild(script);
script.onload = function(){
head.removeChild(script);
}
}
};
Laut AJAX-API lässt sich sogar das google-Script nachladen.
PS: Im Script habe ich for each als Seitenhieb untergebracht. Der IE kanns nämlich nicht.
PPS: Im gesamten Script kommt kein jQuery vor, weil wir das Framwork ja erst nachladen wollen.
