Soll Jquery-Code in Kopf- oder Fußzeile gehen?


Answers

Scripte am unteren Rand platzieren

Das Problem von Skripten ist, dass sie parallele Downloads blockieren. Die HTTP / 1.1-Spezifikation schlägt vor, dass Browser pro Hostname nicht mehr als zwei Komponenten parallel herunterladen. Wenn Sie Ihre Bilder aus mehreren Hostnamen bereitstellen, können Sie mehr als zwei Downloads gleichzeitig durchführen. Während ein Skript heruntergeladen wird, startet der Browser keine anderen Downloads, auch nicht bei verschiedenen Hostnamen. In manchen Situationen ist es nicht einfach, Skripte nach unten zu verschieben. Wenn das Skript beispielsweise document.write verwendet, um einen Teil des Seiteninhalts einzufügen, kann es nicht auf der Seite nach unten verschoben werden. Es könnte auch Probleme mit dem Lösungsumfang geben. In vielen Fällen gibt es Möglichkeiten, diese Situationen zu umgehen.

Ein alternativer Vorschlag, der oft auftaucht, ist die Verwendung von zurückgestellten Skripten. Das DEFER-Attribut zeigt an, dass das Skript document.write nicht enthält und ein Anhaltspunkt für Browser ist, dass sie das Rendern fortsetzen können. Leider unterstützt Firefox das DEFER-Attribut nicht. Im Internet Explorer kann das Skript zurückgestellt werden, aber nicht so viel wie gewünscht. Wenn ein Skript verschoben werden kann, kann es auch an den unteren Rand der Seite verschoben werden. Dadurch werden Ihre Webseiten schneller geladen.

EDIT: Firefox unterstützt das DEFER-Attribut seit Version 3.6.

Quellen:

Question

Wo ist der beste Ort, um Jquery-Code (oder separate Jquery-Datei) zu setzen? Werden Seiten schneller geladen, wenn ich sie in die Fußzeile lege?




Kurz bevor </body> laut diesem Link der beste Platz ist, macht es Sinn.

Am besten testen Sie selbst.




In der Regel werden alle Skripte am Ende der Seite platziert, aber ich verwende ASP.NET MVC mit einer Reihe von jQuery-Plugins. Ich finde, dass alles besser funktioniert, wenn ich meine jQuery-Skripte in den <head> -Abschnitt lege der Masterseite.

In meinem Fall gibt es Artefakte, die auftreten, wenn die Seite geladen wird, wenn sich die Skripts am Ende der Seite befinden. Ich benutze das jQuery TreeView-Plugin, und wenn die Skripte nicht am Anfang geladen werden, wird die Baumstruktur ohne die notwendigen CSS-Klassen dargestellt, die das Plugin dem Plugin auferlegt. So erhalten Sie dieses lustig aussehende Durcheinander, wenn die Seite zuerst geladen wird, gefolgt von der richtigen Darstellung des TreeView. Sehr schlecht aussehend. Durch das Einfügen der jQuery-Plugins in den <head> -Abschnitt der Masterseite wird dieses Problem behoben.




Nimbuz bietet eine sehr gute Erklärung des Problems, aber ich denke, die endgültige Antwort hängt von Ihrer Seite ab: Was ist wichtiger für den Benutzer, um früher zu haben - Skripte oder Bilder?

Es gibt einige Seiten, die ohne die Bilder keinen Sinn ergeben, aber nur geringfügige, nicht essentielle Skripte haben. In diesem Fall ist es sinnvoll, Skripte ganz unten zu platzieren, damit der Benutzer die Bilder schneller sehen und die Seite besser verstehen kann. Andere Seiten benötigen Skripts, um zu funktionieren. In diesem Fall ist es besser, eine Arbeitsseite ohne Bilder zu haben als eine nicht funktionierende Seite mit Bildern, daher ist es sinnvoll, Skripte ganz oben zu platzieren.

Eine andere Sache zu berücksichtigen ist, dass Skripte in der Regel kleiner als Bilder sind. Natürlich ist dies eine Verallgemeinerung und Sie müssen sehen, ob es für Ihre Seite gilt. Wenn dies der Fall ist, dann ist das für mich ein Argument dafür, sie zuerst als Faustregel zu setzen (dh, es sei denn, es gibt einen guten Grund, etwas anderes zu tun), weil sie Bilder nicht so verzögern, wie Bilder die Skripte verzögern würden. Schließlich ist es viel einfacher, ein Skript ganz oben zu haben, da Sie sich nicht darum kümmern müssen, ob es bereits geladen ist, wenn Sie sie benötigen.

Zusammenfassend kann man sagen, dass ich Skripte standardmäßig oben anlege und nur abwäge, ob es sich lohnt, sie nach dem Ende der Seite nach unten zu verschieben. Es ist eine Optimierung - und ich möchte es nicht vorzeitig machen.




Related