ASP.NET Core (divpadsmit) priekšgala JS, CSS komplektēšana un saspiešana

Maz putas · Publicēts 2022-3-28 20:55:50

Prasības: Iepriekšējos .NET Framework MVC projektos JS, CSS var apvienot un saspiest, izmantojot Microsoft Microsoft.AspNet.Web.Optimization bibliotēku. Kā pēc ASP.NET Core izmantošanas apvienot un saspiest esošos JS un CSS failus?

.NET Framework projekts atsaucas uz sekojošo:

Pieteikšanās ir redzama.

Parauga kods:

Pieteikšanās ir redzama.

Saistoši

Komplektēšana apvieno vairākus failus vienā failā. Komplektēšana samazina servera pieprasījumu skaitu, kas nepieciešams, lai atveidotu tīmekļa līdzekli, piemēram, tīmekļa lapu. Varat izveidot tik daudz atsevišķu komplektu, cik vēlaties, īpaši CSS, JavaScript un citiem. Mazāk failu nozīmē no pārlūkprogrammas uz serveri vai no pakalpojuma, kas nodrošina lietojumprogrammuMazāk HTTP pieprasījumu。 Tas uzlabo mājas lapas ielādes veiktspēju.

Saspiest

Samaziniet nevajadzīgo rakstzīmju noņemšanu no koda, nemainot funkcionalitāti. Rezultāts bijaPieprasīto resursu, piemēram, CSS, attēlu un JavaScript failu, lielums ir ievērojami samazināts。 Bieži sastopamās minimifikācijas blakusparādības ir mainīgo nosaukumu saīsināšana līdz vienai rakstzīmei un komentāru un nevajadzīgu atstarpju noņemšana. Tajā pašā laikā tas varKoda sajaukšana, kas neveicina citu konkurentu lasīšanu mūsu avota kodu.

Veiktspējas ieguvumi no komplektēšanas un saspiešanas

Nākamajā tabulā ir izklāstītas atšķirības starp aktīvu iekraušanu atsevišķi un komplektēšanas un samazināšanas izmantošanu:

Tas ietaupa satiksmi un uzlabo ielādes ātrumu tīkla transporta ziņā, vienlaikus samazinot HTTP pieprasījumus un uzlabojot ielādes ātrumu.

HTTP pieprasījumu galvenēm pārlūkprogramma ir ļoti detalizēta. Komplektā kopējais nosūtīto baitu skaits ir ievērojami samazināts. Ielādes laiki liecina par būtiskiem uzlabojumiem, taču šis piemērs darbojas lokāli. Komplektēšanu un samazināšanu var apvienot ar tīklā transportētiem aktīviem, lai sasniegtu augstāku veiktspējas pieaugumu.

ASP.NET Core nav sava komplektēta un saspiesta risinājuma, un tam ir jāizmanto trešās puses nodrošināts risinājums, šajā rakstā tiek izmantots "LigerShark.WebOptimizer.Core(Bibliotēka galu galā piezvanīja.)NUglifyIeviest JS un CSS apstrādi), GitHub adrese:Hipersaites pieteikšanās ir redzama.

Vispirms izveidojiet jaunu projektu ASP.NET Core 6 un palaidiet šādu komandu, lai atsauktos:

Pieteikšanās ir redzama.

Izveidojiet jaunu statisko mapi projektā wwwroot, lai saglabātu testa css un js failus. Izveidojiet jaunu CSS un JS failu, kā parādīts tālāk.

Modificējiet Program.cs failu un pievienojiet WebOptimizer pakalpojumu un starpprogrammatūru, galvenais kods ir šāds:

Pieteikšanās ir redzama.

Mēģinot sākt projektu, mēs konstatējam, ka gan CSS, gan JS koda komentāri ir izdzēsti, un faili ir saspiesti, un daži JS mainīgie ir samazināti līdz vienam burtam, kā parādīts zemāk redzamajā attēlā:

Pēc tam izveidojiet jaunu js failu no statiskās mapes, lai pārbaudītu komplektēšanas funkciju.Apvienojiet test.js un test2.js vienā common.js failā(un neģenerē common.js fizisko failu), konfigurācijas kods ir šāds:

Pieteikšanās ir redzama.

Atveidojumi ir šādi:

Atsauce:

Hipersaites pieteikšanās ir redzama.
Hipersaites pieteikšanās ir redzama.

Maz putas · Publicēts 2022-3-28 20:56:47

Pārskats:

ASP.NET Core (XI) galapunkta maršruts pievieno starpprogrammatūru, lai parādītu visus DI pakalpojumus
https://www.itsvse.com/thread-10269-1-1.html

ASP.NET Detalizēts skaidrojums par konfigurācijas prioritātēm kodolā [10].
https://www.itsvse.com/thread-10265-1-1.html

ASP.NET Detalizēts skaidrojums par Core starpprogrammatūru (9).
https://www.itsvse.com/thread-9647-1-1.html

ASP.NET Detalizēts skaidrojums par pamata starpprogrammatūru
https://www.itsvse.com/thread-8126-1-1.html

ASP.NET Swagger lietotāja interfeisa noklusējuma parametru bedre Core(8).
https://www.itsvse.com/thread-9640-1-1.html

ASP.NET Core (7) Sistēmas pirmkoda padziļināta analīze
https://www.itsvse.com/thread-9601-1-1.html

ASP.NET Core (VI) DI manuāli iegūst objektu injicēšanas metodi
https://www.itsvse.com/thread-9595-1-1.html

ASP.NET Core (pieci) ir balstīts uz CAP sadalītajiem darījumiem
https://www.itsvse.com/thread-9593-1-1.html

ASP.NET Core(4) filtra vienotā ModelState modeļa validācija
https://www.itsvse.com/thread-9589-1-1.html

ASP.NET Core (iii) Dinamiski izveidojiet instances, izmantojot ActivatorUtilities
https://www.itsvse.com/thread-9488-1-1.html

ASP.NET kodols (2) Restartējiet lietojumprogrammu pēc koda
https://www.itsvse.com/thread-9480-1-1.html

ASP.NET Core (1) izmanto Redis kešatmiņu
https://www.itsvse.com/thread-9393-1-1.html

lidojošas zivis · Publicēts 2022-3-29 00:38:21

Iemācieties mācīties.

Džons Jangs · Publicēts 2022-4-6 12:02:33

Ligershark.WebOptimizer.Core un WebMarkupMin.AspNetCore6 abi mēģināja

Maz putas · Publicēts 2022-4-6 13:45:12

johnyoung Publicēts 2022-4-6 12:02
Ligershark.WebOptimizer.Core un WebMarkupMin.AspNetCore6 abi mēģināja

Kurš ir labāks

Džons Jangs · Publicēts 2022-4-6 14:53:12

Šo ziņu pēdējo reizi rediģēja johnyoung, 2022-4-6 14:56

(Es nezinu, kā izdzēst dublikātus komentārus, lūdzu, izdzēsiet šo ziņu, kad tīmekļa pārzinis to redz)

Džons Jangs · Publicēts 2022-4-6 14:54:11

Mazais sārņi Publicēts 2022-4-6 13:45
Kurš ir labāks

Man ir provizoriska izpratne: pirmais ir apvienot un saspiest js un css failus, otrais ir saspiest lapas html un js un css kodu un http saspiešanu lapā utt., un nav skaidrs, vai pēdējais var apvienot un saspiest js un css failus. Es vienkārši to izmēģināju un neizmantoju to padziļināti. Es ceru, ka jūs izpētīsiet un publicēsiet vēl vienu rakstu.

Maz putas · Publicēts 2024-4-24 15:35:15

Konfigurējiet izstrādes vidi, nesaspiežot css un js, kodu:

Pieteikšanās ir redzama.

Maz putas · Publicēts 2024-10-10 11:28:22

Priekšgalā tiek izmantots Minify, lai saspiestu un sapludinātu vairākus CSS failus
https://www.itsvse.com/thread-10845-1-1.html

[Avots] ASP.NET Core (divpadsmit) priekšgala JS, CSS komplektēšana un saspiešana

Saistītās ziņas

Skatītās sadaļas