Buona strutturazione di JavaScript in un progetto?

Question

Quindi, sto abbastanza fatto con il JS nel mio sito ora. Essa implica jQuery (e come tale init .ready) La pagina ha due parti, la tomaia è principalmente Google Maps e minore è moduli di immissione.

Tutto questo è attualmente in una .js, funzioni, INIT, iterazioni, tutto. E 'bene struttura e tutto il resto, tutto è fatto correttamente.

La mia domanda è però: Che cosa è una buona struttura? Dovrei essere mettere la metà superiore in un unico file e il più basso in un altro? O devo mettere tutte le inizializzazioni necessarie sotto il .ready () e posizionare tutte le funzioni in un altro file? O devo tenere tutto in un file in continua crescita?

Answer 1

Dal punto di vista delle prestazioni, fornendo tutto il vostro JS in un unico file al browser come suggerito dalle altre risposte è ragionevole. Tuttavia, avendo il codice costruito in questo modo non è, ogni "classe" dovrebbe essere in un file separato, le cose frazionamento per entità e un file di controllo o due per gestire le chiamate di pagina effettivi - lo stesso come in qualsiasi altra lingua. Questi possono poi essere combinate in un unico file per condotta sia in anticipo, o dinamicamente -. Preferibilmente minimizzati

Answer 2

Mantenere le chiamate di script al minimo migliora il tempo di elaborazione - ogni script includono è un round-trip che aggiunge tempo. Così -. Preferenza personale, fintanto che non si preoccupano i tempi di caricamento delle pagine

Best Practices per accelerare inizia il vostro sito web via con Riduci a icona HTTP Le richieste :

  

80% del tempo di risposta dell'utente finale è   trascorso sul front-end. La maggior parte di questo   il tempo è legato a scaricare tutta la   componenti nella pagina: immagini,   fogli di stile, script, Flash, etc.   Riducendo il numero di componenti   sua volta riduce il numero di HTTP   le richieste necessarie per il rendering della pagina.   Questa è la chiave per le pagine più velocemente.

     

Un modo per ridurre il numero di   componenti nella pagina è semplificare   il design della pagina. Ma c'è un modo   a pagine costruire con contenuti più ricchi   ma anche di ottenere una risposta rapida   volte? Qui ci sono alcune tecniche per   riducendo il numero di richieste HTTP,   pur sostenendo pagina ricchi   disegni.

     

file combinati sono un modo per ridurre il   numero di richieste HTTP combinando   tutti gli script in un singolo script, e   Allo stesso modo la combinazione di tutti i CSS in un   singolo foglio di stile. La combinazione di file è   più difficile quando gli script e   fogli di stile variano da una pagina all'altra,   ma facendo questa parte del suo rilascio   processo migliora i tempi di risposta.

Answer 3

Personalmente, preferisco tenere tutto il codice in un unico file, in modo che il browser deve prendere solo un file e non due / tre / quattro / qualunque cosa.

Ma penso che sia fino a preferenze personali.