ASP.NET Minification utilizing WebMarkupMin – Programming in CSharp

The minification course of is among the most essential steps to enhance the velocity of your web site. The minification objective is to lower the dimensions of the information and assets despatched to the customers. This course of implies eradicating pointless symbols, white characters, and redundant code. It additionally implies rewriting your code to take up as little house as potential. For instance, the JavaScript variables are renamed to at least one or two letters names. 

Most fashionable web sites minify the JavaScript and CSS information. A few of them, like Google and Fb, even minify the HTML.

I’m a giant fan of the library Net Markup Minifier of Andrey Taritsyn. That is usually up to date and is broadly utilized by many web sites and frameworks, together with the MiniBlog running a blog platform of Mads Kristensen. It helps completely different frameworks together with all variations of ASP Dotnet Core, ASP WebForms, and ASP MVC.  You can even use the core library to minify code as you need.

The nicest factor concerning the WebMarkupMin library is that it minifies your objects at runtime. Which means it could actually additionally minify inline JavaScript and CSS. The CSHTML pages comprise Razor syntax that’s onerous to be minified. On the opposite at runtime, the HTML is already generated so you’ll be able to minify with out issues.

Net Markup Minifier set up

WecMarkupMin is simple to put in:

1. Set up the corresponding NuGet bundle. For this tutorial, I assume that you’ve got a .NET 6 internet software:

   Set up-Package deal WebMarkupMin.AspNetCore6

2. Add the WebMarkupMin companies:

   companies.AddWebMarkupMin()
       .AddHtmlMinification()
       .AddXmlMinification()
       .AddHttpCompression(); // this line is elective if you wish to embrace the http compression. It is going to decrease the dimensions of the information.

   You possibly can go an possibility delegate that may configure the minifiers. You possibly can for instance to exclude some pages, or not take away the feedback.

       companies.AddWebMarkupMin(choices =>
   {
       choices.AllowMinificationInDevelopmentEnvironment = true;
       choices.AllowCompressionInDevelopmentEnvironment = true;
   }).AddHtmlMinification(choices =>
   {
       choices.MinificationSettings.RemoveHtmlComments = false;
       choices.ExcludedPages = new Listing<IUrlMatcher>
       {
           new WildcardUrlMatcher("/exclude/e*-pages"),
           new ExactUrlMatcher("/exclude-this-particular-page")
       };
   }

   It’s extremely configurable so check out the library courses and strategies.

3.  Add the middleware earlier than calling MapControllerRoute or UseEndpoints

   app.UseWebMarkupMin();
   
   app.UseEndpoints(endpoints =>
   {
       endpoints.MapControllerRoute(
           title: "default",
           sample: "{controller=House}/{motion=Index}/{id?}");
   
   
       endpoints.MapRazorPages();
   });

WebMarkupMin and the efficiency of minification

I’ve checked for a house web page of considered one of my web sites:

Earlier than WebMarkupMin, the web page supply code has 19428 characters

After WebMarkupMin Minification, the identical web page has 14429 characters. Meaning 25% lower than the unique file.