Optimizing Performance in ASP.NET Core: An Introduction to Bundling and Minification

Bundling and minification are techniques used to optimize the performance of web applications by reducing the size of JavaScript and CSS files. These techniques are particularly useful for improving the performance of web applications that use a lot of JavaScript and CSS, such as single-page applications (SPAs) and progressive web apps (PWAs).

In ASP.NET Core, bundling and minification can be done using the built-in middleware, which is included in the Microsoft.AspNetCore.StaticFiles package. To use bundling and minification in your ASP.NET Core application, you need to configure the middleware in your Startup class.

Here's an example of how to configure the bundling and minification middleware in the Configure method of the Startup class:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    // ...

    app.UseStaticFiles();

    app.UseStaticFiles(new StaticFileOptions
    {
        OnPrepareResponse = ctx =>
        {
            ctx.Context.Response.Headers[HeaderNames.CacheControl] = "public,max-age=36000";
        }
    });

    // ...
}

This example configures the middleware to use the default settings for bundling and minification. However, you can also customize the settings, such as the output file names, and provide your own custom code for minifying and bundling the files.

Additionally, in .NET 7, you can use the Microsoft.AspNetCore.WebOptimizer package, which provides an easy-to-use API for configuring bundling and minification in your application. This package allows you to bundle and minify your files using either the built-in options or custom code, and it also supports features such as versioning, cache busting and more.

public void ConfigureServices(IServiceCollection services)
{
    // ...

    services.AddWebOptimizer(pipeline =>
    {
        pipeline.AddCssBundle("/css/site.css", "css/main.css", "css/custom.css");
        pipeline.AddJavaScriptBundle("/js/site.js", "js/main.js", "js/custom.js");
    });

    // ...
}

In this article, you have learned about bundling and minification in ASP.NET Core, and how to use these techniques to improve the performance of your web applications. With the use of the Microsoft.AspNetCore.StaticFiles and Microsoft.AspNetCore.WebOptimizer package, you can easily configure and customize the bundling and minification in your application.