Zahteve: V prejšnjih projektih .NET Framework MVC je JS, CSS mogoče združiti in stisniti z uporabo Microsoftove knjižnice Microsoft.AspNet.Web.Optimization. Po uporabi ASP.NET Core, kako združim in stisnem obstoječe JS in CSS datoteke?
Projekt .NET Framework se sklicuje na naslednje:
Primer kode:
vez
Združevanje združuje več datotek v eno datoteko. Združevanje zmanjša število strežniških zahtevkov, potrebnih za upodabljanje spletnega sredstva, kot je spletna stran. Lahko ustvarite poljubno število posameznih paketov posebej za CSS, JavaScript in še več. Manj datotek pomeni prehod iz brskalnika na strežnik ali iz storitve, ki zagotavlja aplikacijoManj HTTP zahtevkov。 To izboljša zmogljivost nalaganja domače strani.
stisniti
Zmanjšajte odstranjevanje nepotrebnih znakov iz svoje kode, ne da bi spremenili funkcionalnost. Rezultat je bilVelikost zahtevanih virov, kot so CSS, slike in JavaScript datoteke, je znatno zmanjšana。 Pogosti stranski učinki minifikacije vključujejo skrajšanje imen spremenljivk na en znak ter odstranjevanje komentarjev in nepotrebnih presledkov. Hkrati pa lahkoZmede kodo, kar ni ugodno za to, da bi drugi konkurenti brali našo izvorno kodo.
Izboljšave zmogljivosti zaradi združevanja in kompresije
Naslednja tabela prikazuje razlike med nalaganjem sredstev posamezno in uporabo združevanja ter minifikacije:
Prihrani promet in izboljša hitrost nalaganja v smislu omrežnega transporta, hkrati pa zmanjša HTTP zahteve in izboljša hitrost nalaganja.
Za HTTP glave zahtevkov je brskalnik zelo podroben. Ko so združeni, se metrika skupnega števila poslanih bajtov bistveno zmanjša. Časi nalaganja kažejo pomembne izboljšave, vendar ta primer teče lokalno. Združevanje in minifikacija se lahko združita z sredstvi, ki se prenašajo po omrežju, da dosežejo večje izboljšave zmogljivosti.
ASP.NET Core nima lastne združene in stisnjene rešitve ter mora uporabljati rešitev, ki jo zagotovi tretja oseba, ta članek uporablja "LigerShark.WebOptimizer.Core(Knjižnica je na koncu poklicala.)NUglifyImplementacija obravnave JS in CSS), GitHub naslov:Prijava do hiperpovezave je vidna.
Najprej ustvarite nov projekt ASP.NET Core 6 in zaženite naslednji ukaz za referenco:
Ustvarite novo statično mapo v projektu wwwroot za shranjevanje testnih CSS in JS datotek. Ustvarite novo CSS in JS datoteko, kot je prikazano spodaj:
Spremenite Program.cs datoteko in dodajte storitev WebOptimizer in vmesno programsko opremo, glavna koda je naslednja:
Ko poskušamo začeti projekt, ugotovimo, da so bili komentarji tako CSS kot JS kode izbrisani, datoteke stisnjene, nekatere spremenljivke v JS pa so bile zmanjšane na eno črko, kot je prikazano na spodnji sliki:
Nato iz statične mape ustvari novo js datoteko, da preizkusim funkcijo združevanja.Združite test.js in test2.js v eno common.js datoteko(in ne generira common.js fizične datoteke), konfiguracijska koda je naslednja:
Upodobitve so naslednje:
Referenčni:
Prijava do hiperpovezave je vidna.
Prijava do hiperpovezave je vidna.
|
Objavljeno 28. 3. 2022 ob 20:55:50
|
|
|
|
Najemodajalec|
Objavljeno 2022-3-28 20:56:47
|
Objavljeno 29. 3. 2022 00:38:21
|
(Ne vem, kako izbrisati podvojene komentarje, prosim izbrišite to objavo, ko jo spletni skrbnik vidi)