Cerințe: În proiectele MVC anterioare cu .NET Framework, JS, CSS poate fi inclus și comprimat folosind biblioteca Microsoft.AspNet.Web.Optimization a Microsoft. După ce folosesc ASP.NET Core, cum pot să combin și să comprim fișierele JS și CSS existente?
Proiectul .NET Framework face referire la următoarele:
Cod exemplu:
legare
Gruparea combină mai multe fișiere într-un singur fișier. Gruparea reduce numărul de cereri de server necesare pentru a reda un asset web, cum ar fi o pagină web. Poți crea câte pachete individuale dorești, special pentru CSS, JavaScript și altele. Mai puține fișiere înseamnă de la browser către server sau de la serviciul care furnizează aplicațiaMai puține cereri HTTP。 Acest lucru îmbunătățește performanța încărcării paginii principale.
Comprima
Minizează eliminarea caracterelor inutile din codul tău fără a modifica funcționalitatea. Rezultatul a fostDimensiunea resurselor solicitate, cum ar fi CSS, imagini și fișiere JavaScript, este semnificativ redusă。 Efectele secundare comune ale minificării includ scurtarea numelor variabilelor la un singur caracter și eliminarea comentariilor și a spațiilor inutile. În același timp, poateConfundarea codului, ceea ce nu este favorabil pentru ca alți concurenți să citească codul sursă al nostru.
Câștiguri de performanță prin pachet și compresie
Tabelul următor prezintă diferențele dintre încărcarea individuală a activelor și utilizarea pachetelor și minificării:
Economisește trafic și îmbunătățește viteza de încărcare în ceea ce privește transportul în rețea, reducând totodată cererile HTTP și îmbunătățind viteza de încărcare.
Pentru anteturile de cerere HTTP, browserul este foarte detaliat. Când este agregat, metrica totală a octeților trimiși este semnificativ redusă. Timpii de încărcare arată îmbunătățiri semnificative, dar acest exemplu rulează local. Gruparea și minificarea pot fi combinate cu activele transportate prin rețea pentru a obține câștiguri de performanță mai mari.
ASP.NET Core nu are propria soluție compactă și comprimată și trebuie să folosească o soluție oferită de o terță parte, acest articol folosește "LigerShark.WebOptimizer.Core(Biblioteca a sunat în cele din urmă.)NUglifyImplementează gestionarea JS și CSS), adresa GitHub:Autentificarea cu hyperlink este vizibilă.
Mai întâi, creează un proiect nou ASP.NET Core 6 și rulează următoarea comandă pentru a face referință:
Creează un folder static nou în proiectul wwwroot pentru a stoca fișierele css și js de test. Creează un nou fișier CSS și JS, așa cum se arată mai jos:
Modifică fișierul Program.cs și adaugă serviciul WebOptimizer și middleware-ul, codul principal fiind următorul:
Când încercăm să începem proiectul, constatăm că comentariile atât ale codului CSS, cât și ale codului JS au fost șterse, fișierele au fost comprimate, iar unele variabile din JS au fost reduse la o singură literă, așa cum se arată în figura de mai jos:
Apoi creează un fișier js nou din folderul static pentru a testa funcția de pachetare.Grupează test.js și test2.js într-un singur fișier common.js(și nu generează un fișier fizic common.js), codul de configurare este următorul:
Randările sunt următoarele:
Referință:
Autentificarea cu hyperlink este vizibilă.
Autentificarea cu hyperlink este vizibilă.
|
Postat la 28-03-2022, 20:55:50
|
|
|
|
Proprietarul|
Postat la 28-03-2022 20:56:47
|
Postat la 29-03-2022 00:38:21
|
(Nu știu cum să șterg comentariile duplicate, vă rog ștergeți această postare când o vede webmasterul)