Gute Strukturierung von JavaScript in einem Projekt?

Question

Also, ich bin ziemlich mit der JS in meiner Website jetzt getan. Es geht um jQuery (und als solcher ein .ready init) Die Seite besteht aus zwei Teilen, Ober das ist vor allem Google Maps und die unteren sind Eingabeformulare.

All dies ist derzeit in eine js, Funktionen, inits, Iterationen, alles davon. Es ist gut Struktur und das alles, alles richtig gemacht.

Meine Frage ist aber: Was ist eine gute Struktur? Sollte ich die obere Hälfte in einer Datei setzen und die untere in einem anderen? Oder sollte ich alle benötigten Initialisierungen unter dem .ready () und legen Sie alle Funktionen in einer anderen Datei? Oder soll ich halte alles in einer stetig wachsenden Datei?

Answer 1

Aus Performance-Sicht alle Ihre JS in einer einzigen Datei an den Browser liefert, wie die anderen Antworten vorgeschlagen ist sinnvoll. Allerdings haben Sie den Code gebaut auf diese Weise ist nicht jede „Klasse“ in einer separaten Datei sein sollte, Splitting Dinge in Entitäten und eine Steuerdatei oder zwei die eigentliche Seite Anrufe zu handhaben - die gleichen wie in jeder anderen Sprache. Diese können dann in für die Versorgung in einer Datei kombiniert werden entweder vorab oder dynamisch -. Vorzugsweise ebenfalls minimiert

Answer 2

Halten Sie die Skript Anrufe auf ein Minimum verbessert die Verarbeitungszeit - jedes Skript enthalten ist ein Round-Trip, die Zeit hinzufügt. So -. Persönliche Präferenz, solange Sie nicht über Ladezeiten egal

Best Practices für die Beschleunigung Ihrer Website beginnt mit Minimieren HTTP-Requests :

  

80% der Endbenutzers Reaktionszeit   verbrachte auf dem Front-End. Die meisten dieser   Zeit ist in den Download aller gebunden   Komponenten in der Seite: Bilder,   Stylesheets, Skripte, Flash, usw.   Eine Verringerung der Anzahl von Komponenten in   wiederum reduziert die Anzahl der HTTP   Anfragen erforderlich, um die Seite zu machen.   Dies ist der Schlüssel zu einem schnelleren Seiten.

     

Eine Möglichkeit, die Anzahl der zu reduzieren   Komponenten in der Seite zu vereinfachen   das Seitendesign. Aber ist es eine Möglichkeit,   zu bauen Seiten mit reicheren Inhalt   während das Erreichen auch eine schnelle Reaktion   mal? Hier sind einige Techniken für   die Anzahl von HTTP-Anfragen zu reduzieren,   während der Unterstützung noch reiche Seite   Designs.

     

kombinierten Dateien sind eine Möglichkeit, die reduzieren   Anzahl der HTTP-Anforderungen durch die Kombination von   alle Skripte in ein einziges Skript, und   in ähnlicher Weise kombiniert alle CSS in ein   Einzelsheet. Die Kombination von Dateien   mehr herausfordernd, wenn die Skripte und   Sheets variiert von Seite zu Seite,   aber macht diesen Teil Ihrer Veröffentlichung   Prozess verbessert die Antwortzeiten.

Answer 3

Persönlich bevorzuge ich die gesamten Code in einer einzigen Datei zu halten, so dass der Browser nur eine Datei zu holen hat und nicht zwei / drei / vier / was auch immer.

Aber ich denke, es ist auf die persönlichen Vorlieben auf.