Изисквания: В предишни MVC проекти за .NET Framework, JS, CSS могат да бъдат пакетирани и компресирани с помощта на библиотеката Microsoft.AspNet.Web.Optimization на Microsoft. След като използвам ASP.NET Core, как да комбинирам и компресирам съществуващите JS и CSS файлове?
Проектът .NET Framework се позовава на следното:
Примерен код:
подвързване
Обединяването на множество файлове в един файл. Обединяването намалява броя на сървърните заявки, необходими за рендериране на уеб актив, като уеб страница. Можете да създавате колкото искате отделни пакети специално за CSS, JavaScript и други. По-малко файлове означават от браузъра към сървъра или от услугата, която предоставя приложениетоПо-малко HTTP заявки。 Това подобрява производителността при зареждане на началната страница.
Компресиране
Минимизирайте премахването на ненужни символи от кода си, без да променяте функционалността. Резултатът бешеРазмерът на поисканите ресурси, като CSS, изображения и JavaScript файлове, е значително намален。 Чести странични ефекти от минификацията включват съкращаване на имената на променливите до един символ и премахване на коментари и ненужни интервали. В същото време можеОбъркай кода, което не е благоприятно за други конкуренти, които четат нашия изходен код.
Подобрения в производителността от пакетиране и компресия
Следната таблица очертава разликите между зареждането на активи поотделно и използването на пакетиране и минификация:
Той спестява трафик и подобрява скоростта на зареждане по отношение на мрежовия транспорт, като същевременно намалява HTTP заявките и подобрява скоростта на зареждане.
За HTTP заглавни заглавия браузърът е много подробен. Когато се комбинира, общият брой изпратени байтове метрика значително намалява. Времето за зареждане показва значителни подобрения, но този пример работи локално. Обединяването и минификацията могат да се комбинират с активи, пренесени през мрежата, за постигане на по-високи печалби в производителността.
ASP.NET Core няма собствено пакетно и компресирано решение и трябва да използва решение, предоставено от трета страна, тази статия използва "LigerShark.WebOptimizer.Core(Библиотеката в крайна сметка се обади.)NUglifyИмплементирайте JS и CSS обработка), адрес на GitHub:Входът към хиперлинк е видим.
Първо, създайте нов проект ASP.NET Core 6 и изпълнете следната команда за референция:
Създай нова статична папка в проекта wwwroot, за да съхраняваш тестовите css и js файлове. Създайте нов CSS и JS файл, както е показано по-долу:
Модифицирайте Program.cs файла и добавете услугата WebOptimizer и междинния софтуер, основният код е следният:
Когато се опитваме да започнем проекта, откриваме, че коментарите както на CSS, така и на JS кода са изтрити, файловете са компресирани, а някои променливи в JS са намалени до една буква, както е показано на фигурата по-долу:
След това създай нов js файл от статичната папка, за да тестваш функцията за пакетиране.Съберете test.js и test2.js в един common.js файл(и не генерира common.js физически файл), конфигурационният код е следният:
Визуализациите са както следва:
Препратка:
Входът към хиперлинк е видим.
Входът към хиперлинк е видим.
|
Публикувано на 28.03.2022 20:55:50
|
|
|
|
Хазяин|
Публикувано на 28.03.2022 20:56:47
|
Публикувано на 29.03.2022 00:38:21
|
(Не знам как да изтрия дублиращи се коментари, моля, изтрийте този пост, когато уебмастърът го види)