2010-11-23 9 views
2

Wenn ich JavaScript in den head Tag setzen sich wie folgt:Stört JavaScript das Laden anderer Inhalte?

<head> 
<script type="text/javascript" src="jQuery.js"></script> 
<script type="text/javascript"> 
// my jscript 
    </script> 

</head> 

wird es das Laden von anderen Inhalten stören wie Bilder, Texte, etc.? Ich habe gerade mit meinem Freund gestritten; er sagte, dass es das Laden des Designs der Web site stören würde.

Antwort

2

Ja, es sei denn, Sie verwenden async oder defer dann wird das Javascript vor dem HTML-Inhalt geladen. Sie können das Skript unter alle Bilder/Texte verschieben und vor das End-Body-Tag setzen.

Heutzutage sind Browser so schnell, dass es kein großes Problem ist, es sei denn, Sie haben eine zu komplexe Website. Ganz zu schweigen davon, dass jQuery mit jeder Iteration immer schneller und kompakter wird.

Ein anderer Aspekt ist, dass einige moderne Browser mehrere Ressourcen parallel laden, so ist es möglich, dass es in diesen Browsern kein großes Problem ist. Ich kenne die komplizierten Details nicht, vielleicht liefert jemand anderes einen Einblick ...

+0

Ein toller! Danke für eine gute Antwort. Ich verstehe das jetzt viel mehr, als du es erklärst. – Sinzo

+0

@Sinzo Und wenn Sie jQuery (oder eine andere populäre Bibliothek) verwenden, verwenden Sie einen Cache-freundlichen Pfad auf einem CDN (Content Distribution Network; bewegt Daten näher, macht es schneller, in der Theorie)! [Welche jQuery URL für die Produktions-App zu verwenden und warum?] (Http://stackoverflow.com/questions/1535673/which-jquery-url-to-use-for-production-app-and-why) Dies nutzt die Tatsache, dass dieselbe Bibliothek von vielen, vielen Seiten verwendet wird und somit einen neuen Abruf vollständig überspringen kann (wenn es zwischengespeichert wird, aber selbst wenn es eine Abfrage gibt, ist es wahrscheinlich schneller auf einem CDN) - die Lichtgeschwindigkeit ist endlich . –

0

Ja, es wird Seite aus dem Rendering verhindern, bis externes Skript das Laden beendet und die Ausführung beendet.

1

Ja wird es.

Und deshalb ist es wichtig, einen "bereiten" Rückruf zu verwenden (der innerhalb jQuery verfügbar ist). Dies ist der richtige Weg, um sicherzustellen, dass Ihr Code erst ausgeführt wird, wenn die Seite fertig geladen ist, was in den meisten Fällen der Fall ist.

<head> 
<script type="text/javascript" src="jQuery.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
      // my jscript 
    } 
    </script> 

</head> 
0

Wenn Sie in Bezug auf die Seitenlade schneller betroffen sind:

Put CSS an der Spitze, JavaScript im unteren Bereich. Steve Souders (High Performance-Websites, O'Reilly) hat festgestellt, dass das Verschieben von Stylesheets nach oben in Ihrem head-Element die Seiten schneller lädt, indem sie progressiv laden können.

Mit Skripts ist das Gegenteil der Fall. Verschieben Sie nach Möglichkeit externe JavaScript-Dateien an den unteren Rand Ihrer Seiten, oder verzögern Sie das Laden von JavaScript-Dateien in the head.

Progressive Rendering ist für alle Inhalte blockiert, die nach Skripten in Ihr HTML platziert wird.

Verwandte Themen