Se sto progettando un sito Web di una pagina, è meglio creare un file esterno per il mio codice JS o semplicemente inserirlo nel codice HTML? Metterlo sulla pagina è più veloce da caricare? Posso modificare le autorizzazioni per negare le richieste degli utenti per il codice, ma la pagina HTML può ancora chiamare il codice?
Risposte:
Dovresti inserire il tuo codice JS in un file separato perché ciò semplifica il test e lo sviluppo. La domanda su come servi il codice è una questione diversa.
Servire HTML e JS separatamente ha il vantaggio che un client può memorizzare nella cache JS. Ciò richiede di inviare le intestazioni appropriate in modo che il client non emetta una nuova richiesta ogni volta. La memorizzazione nella cache è problematica se si desidera eseguire un aggiornamento e pertanto si desidera invalidare le cache del client. Un metodo consiste nell'includere un numero di versione nel nome file, ad es /static/mylibrary-1.12.2.js.
Se JS si trova in un file separato, non puoi limitare l'accesso ad esso: è difficile (tecnicamente: impossibile) stabilire se è stata effettuata una richiesta a un file JS perché lo hai fatto riferimento nella tua pagina HTML o perché qualcuno vuole scaricarlo direttamente. Puoi tuttavia utilizzare i cookie e rifiutare di servire i clienti che non trasmettono determinati cookie (ma sarebbe sciocco).
Servire il JS all'interno dell'HTML aumenta le dimensioni di ogni pagina, ma questo è OK se è improbabile che un client visualizzi più pagine. Poiché il client non emette una richiesta separata per JS, questa strategia carica la pagina più velocemente, almeno per la prima volta, ma esiste un punto di pareggio in cui la memorizzazione nella cache è migliore. È possibile includere JS, ad esempio tramite PHP.
Qui il client non ha bisogno di un accesso separato al file JS, che può essere nascosto se lo desideri. Ma chiunque può ancora visualizzare il codice JS all'interno dell'HTML.
Altre strategie per ridurre al minimo i tempi di caricamento includono
Minificazione JS che riduce la dimensione del file JS che servi. Poiché la distribuzione avviene solo una volta durante la distribuzione del codice, questo è un metodo molto efficiente per salvare i byte. OTOH questo rende il tuo codice più difficile da capire per i visitatori interessati.
Relativa alla minificazione è la pratica di combinare tutti i tuoi file JS in un singolo file. Ciò riduce il numero di richieste necessarie.
Compressione, che aggiunge un sovraccarico computazionale per ogni richiesta sia sul client che sul server. Tuttavia, il tempo impiegato (de-) compressione è generalmente inferiore al tempo impiegato per la trasmissione dei dati non compressi. La compressione viene generalmente gestita in modo trasparente dal software del server.
Queste tecniche si applicano anche ad altre risorse come le immagini.
Sto progettando un sito Web di una pagina
Se hai letteralmente solo una pagina, allora sì, è meglio (dal punto di vista delle prestazioni) servire tutto in un unico file ... fogli di stile, JavaScript e persino immagini (piccole immagini allineate con URI di dati). Ciò elimina le richieste HTTP aggiuntive richieste per recuperare risorse esterne che sono relativamente lente.
Il file risultante dovrebbe essere compresso con gzip prima di essere pubblicato, il che ridurrà notevolmente la dimensione della risposta a tutto il testo.
Dovresti comunque considerare di avere immagini di grandi dimensioni esterne alla pagina, in quanto esistono limiti alla dimensione degli URI dei dati e alla compatibilità del browser. (ad es. IE8 ha un limite di 32 KB, che equivale a una dimensione effettiva del file di circa 23 KB a causa della natura della codifica base64.)
Posso modificare le autorizzazioni per negare le richieste degli utenti per il codice, ma la pagina HTML può ancora chiamare il codice?
No. Nella migliore delle ipotesi il codice può essere offuscato per "nasconderlo" all'osservatore casuale, ma non offre alcuna protezione reale.
Il codice JS lato client deve essere visualizzato dal browser (ovvero, se la pagina deve utilizzare direttamente JS) - ciò significa che deve essere scaricato dal browser.
Non è possibile che un browser utilizzi JS nella pagina se non è possibile scaricarlo.
A questo proposito, non fa molta differenza se si incorpora JS o lo si inserisce in un file, sebbene la pratica comune sia quella di utilizzare un file JS (separazione delle preoccupazioni per uno).
Se hai un codice che non desideri esporre al browser, dovrai utilizzare il codice lato server (ad esempio node.js, php, perl, asp.net, jsp - ci sono così tante opzioni) e interagire con esso dal browser - al caricamento della pagina iniziale o utilizzando AJAX .
Beh, dipende dalla quantità di codice e dalla tua serietà di essere un programmatore / ingegnere del software rispetto a un semplice programmatore. Ho lavorato con un gruppo di designer che hanno inserito brevi frammenti di codice direttamente in HTML e, mentre mi sono messo in difficoltà, ha funzionato.
Anche se non è qualcosa che farei io stesso, e se vuoi conoscere le migliori pratiche di sviluppo software ti consiglio vivamente di pu tutto in *.jsfile esterno e caricarlo tramite <script>tag.
Per quanto riguarda il tuo secondo punto, no, non puoi negare all'utente o al browser di visualizzare il tuo codice, c'è qualcosa chiamato obfuscationche renderà il tuo codice più difficile da leggere, tuttavia le prestazioni diminuiranno.
è meglio creare un file esterno per il mio codice JS o semplicemente inserirlo nel codice html?
È meglio creare un file esterno per il tuo codice JS. È anche meglio avere uno o due file che servi al client. Ma è anche meglio avere il codice JS suddiviso in più file per problemi di manutenibilità. Per poterlo fare, puoi usare preprocessori come Gulp che uniranno i tuoi diversi file JS in un unico file.
Servire meno file è meglio poiché il client avrà meno richieste HTTP da gestire.
Metterlo sulla pagina è più veloce da caricare?
Sì, ovviamente è più veloce poiché fai solo una richiesta per l'HTML, mentre faresti molte richieste (almeno 2) con il tuo codice JS come esterno. Questo è solo se il tuo codice JS non è minimizzato su entrambi i lati e questo non tiene conto di quanto sarà più difficile mantenere il tuo codice se è tutto in una singola pagina HTML.
Posso modificare le autorizzazioni per negare le richieste degli utenti per il codice, ma la pagina HTML può ancora chiamare il codice?
No non puoi. Il codice JS, come il codice CSS e il codice HTML, è contenuto statico. Ciò significa che una volta che è nel browser, il client può scaricarlo interamente e il suo contenuto. Ogni singolo file, immagine, script è aperto per il download. Ma puoi minimizzare / ugualizzare il tuo codice in modo che sia più difficile per un essere umano utilizzarlo. Questa è solo una conseguenza dell'ugrificazione, che è stata creata prima per le prestazioni.
Molti vantaggi della separazione del contenuto html e javascript in file separati: