Beste Möglichkeit, JavaScript-Dateien zu organisieren

So habe ich Web-App mit mehreren JS-Dateien (jQuery, jQuery, meine eigenen JS-Code und mehr). Angenommen, ich habe eine Seite namens index.html. Was wäre die beste Vorgehensweise, um meine js-Dateien einzubinden/zu laden? Ich habe darüber nachgedacht, eine separate JS-Datei zu erstellen, die das Preloading durchführt (alle anderen Skripte einbeziehen und jQuery.noConflict() aufrufen). Was schlägst du vor? Ist das möglich? Wie würdest du es umsetzen?Beste Möglichkeit, JavaScript-Dateien zu organisieren

Danke!

Quelle

2011-01-03 Ron

Was spricht dagegen, sie nur in den Kopfbereich aufzunehmen? Der Browser kümmert sich um das Caching. –

Wenn Sie viele Dateien haben, stecken Sie sie nicht in den Kopf. Setzen Sie sie am Ende des Körpers. Erstellen Sie eine Seite, die ohne die Dateien gut aussieht, und fügen Sie sie dann am Ende des Textkörpers hinzu. Die von Ihnen erstellte Seite dient als Begrüßungsseite. Sie können Ihre Splash-Elemente ausblenden, sobald jquery geladen wird. – Hemlock

@Pekka: Das Einfügen von Skripten in den "Kopf" ist nur notwendig, wenn Sie ihre Funktionalität beim Rendern von "body" verwenden und die wahrgenommene Ladezeit der Seite verlangsamen. Wenn Sie ihre Funktionalität * während des Renderings * nicht benötigen (und das schließt ein, dass der Benutzer auf Dinge klickt, während die Seite noch erstellt wird), legen Sie sie am unteren Rand von "body" ab. [Mehr] (http://developer.yahoo.com/performance/rules.html) –

Der beste Weg ist, alle js-Dateien zu minimieren und sie in einem Skript zu kombinieren. Dies wird weniger Arbeit für den Browser verursachen, da es nicht mehrere Anforderungen an den Server stellen muss.

Quelle

2011-01-03 14:38:45 kemiller2002

Wenn Sie vorhaben, alles zur gleichen Zeit laden, können Sie sie alle in eine einzige komprimierten Datei setzen

Quelle

2011-01-03 14:40:31 stephen776

danke. Wo finde ich einen JS-Dateikompressor? – Ron

@Ron: Sie können Google Kompressoren verwenden, http://code.google.com/closure/compiler/ –

^^^ yep Google Schließung Compiler ist der Weg zu gehen ... Ich glaube, das ist, was jQuery selbst mit komprimiert ist . – stephen776

Check out RequireJS, ein intelligenter und robuster Script Loader für JavaScript. Es wurde entwickelt, um gut mit jQuery zu funktionieren und wird mit optimization tool geliefert, um alle Ihre Skripte zu einem zu kombinieren.

Quelle

2011-01-03 14:55:50

+1 Es ist besonders praktisch in App-Dev. Ich mag das Modulmuster in Anwendungen sehr. –

Im Allgemeinen kombinieren Sie Ihre Skript-Dateien in eine Datei (und minify oder compress ihnen oder sogar compile sie, aber beachten Sie, dass dieser letzte Punkt ist nicht Zero-Impact gibt es Schmerzpunkte). Siehe Hinweise here und here. Im Grunde ist eine der ersten Richtlinien, die Sie für eine gute schnelle Seitenauslastung sehen, "HTTP-Anfragen minimieren". So wollen Sie nicht sechs separate script Tags, wo Sie eine haben könnten.

Für populäre Skripts können Sie jedoch von der Verwendung von ihnen von Google's CDN profitieren. Google ist so freundlich, die beliebtesten JavaScript-Bibliotheken kostenlos auf seinem CDN zu hosten. Der Vorteil hier ist nicht nur, dass das CDN ziemlich schnell ist, sondern auch, dass der Browser des Zielbenutzers eine zwischengespeicherte Version des Skripts hat, das Sie verwenden möchten, obwohl Sie noch nie zuvor auf Ihre Seite waren.

Quelle

2011-01-03 14:57:20

können Sie mehr erklären "aber beachten Sie, dass dieser letzte Punkt nicht Null-Auswirkungen ist, gibt es Schmerzpunkte"? Danke – user544262772

@Oddant: Die Verwendung des Closure-Compilers erfordert einige Praktiken auf Quell-Ebene, die normalerweise nur von Minifiern/Kompressoren benötigt werden. Aber in ihrem einfachen Modus sind sie überhaupt nicht beschwerlich. (Advanced-Modus ist mehr Aufwand - aber dann erhalten Sie auch mehr Nutzen.) –

Beste Möglichkeit, JavaScript-Dateien zu organisieren

Antwort

Verwandte Themen