In development, we like to use multiple JS and CSS files for modularity, readability and maintainability of code and it’s a good practice too. But in some cases it leads to degradation of the overall performance of the website. Because multiple JS and CSS files require multiple HTTP requests from a browser leads to degrade the performance & load time of your web pages.
Most of the current major browsers limit the number of simultaneous connections per each hostname to six. That means that while six requests are being processed, additional requests for assets on a host will be queued by the browser.
In ASP.NET MVC 4 – Microsoft provides System.Web.Optimization for Bundling and Minification, which is installed by default with new ASP.NET MVC4 application template as NuGet package. It allows the application to minify and bundle the files on the fly.
For bundling css and Js, you can use StyleBundle/ScriptBundle which is just syntaxtic sugar for not having to pass in new Css/JsMinify. See example below.
But LESS transformation to the bundle has to be specified during the bundle creation. Bundle Transformer – a modular extension for System.Web.Optimization (also known as the Microsoft ASP.NET Web Optimization Framework). Classes CssTransformer and JsTransformer, included in the core of Bundle Transformer, implement interface IBundleTransform. They are intended to replace the standard classes CssMinify and JsMinify. See example below.