Posizionamento file in ASP.NET MVC

Uno dei problemi che hanno molte applicazioni è che, sebbene carichino rapidamente il contenuto, non vengono visualizzati rapidamente nel browser dell'utente, ovvero il browser ha finito di caricare tutto il contenuto, tutte le immagini e tutte le CSS sì JS, ma c'è un piccolo ritardo tra ciò che carichiamo e ciò che vediamo.
Ciò è in gran parte dovuto alla posizione dei file caricati nel HTML, cioè, probabilmente abbiamo il CSS e il JS misto e questo rende difficile per il browser visualizzare tutto come durante il caricamento di un file JS è necessario elaborarlo prima di continuare con il file successivo.
La prima raccomandazione è sempre quella di posizionare i file di stile come CSS nella parte superiore del nostro HTML, questo ci permette di far visualizzare progressivamente al browser la pagina dell'applicazione il prima possibile.
In questo modo evitiamo di vedere una pagina vuota per molti secondi prima di vedere tutto caricato, se non vediamo come la pagina si sta gradualmente costruendo, questo serve da sollievo per gli utenti, soprattutto quelli che hanno una connessione più lenta alla rete o ad Internet .
Se i fogli di stile o CSS sono in fondo, i browser normalmente non caricheranno le informazioni per evitare di dover cambiare lo stile una volta raggiunto quel punto, senza che l'utente veda nulla.
Lo scopo è che il browser possa continuare a caricare le risorse della pagina, poiché se trova un file JS finché non lo carica senza errori, non procederà a scaricare altre risorse, anche se si trovano in un CDN.
Dove mettere i file JS?Per questo posizioniamo i file JS il più indietro possibile nel nostro HTML, sebbene ci siano casi in cui non è possibile a causa della struttura dell'applicazione, allora possiamo posizionare l'attributo differire con cui diciamo al browser che può caricarlo alla fine di tutto.
Il problema con l'attributo differire è che non tutti i browser lo interpretano allo stesso modo, quindi a volte non può fare ciò che pensiamo, tuttavia se possiamo posizionare un file questo attributo significa che può essere spostato alla fine.
Vediamo nell'immagine seguente com'è il processo di caricamento di una pagina, nella prima parte i file sono tutti in primo piano e in nessun ordine particolare, nella seconda parte i CSS su e il JS fuori uso:

Dov'è l'occhio è il punto del processo in cui l'utente può vedere la pagina dell'applicazione, notiamo poi come nella prima parte la pagina sia vista molto più tardi di quanto possiamo vedere nella seconda parte.
Con questo finiamo questo tutorial, ora possiamo aggiungere un nuovo elemento per migliorare la velocità e le prestazioni della nostra applicazione oltre a ridurre l'attesa dell'utente per vedere cosa sta caricando il suo browser.Ti è piaciuto e hai aiutato questo Tutorial?Puoi premiare l'autore premendo questo pulsante per dargli un punto positivo