What is Bundling and Minification in ASP.NET MVC?
Bundling
In normal scenario let say for an instance,
- User makes a request to index action in customer controller.
- Action method will return a view result.
- Now the view contains reference to 3 js files and 3 css files.
- When browser receives the view in response, it comes to know about these references so it will make 6 more requests to server asking for the referenced files.
It will affect the overall response time of the view. To get one complete view browser makes 7 requests (one for view, 3 for js and 3 for css). Now imagine the situation when we have more number of css and js files. 🙂 🙂
Bundling is the solution for the same.
It let us combine multiple files into one file at runtime. Using this concept we can create bundles of js and css files. Fewer files mean fewer response times and it means quick response time.
Minification
Normally how we write or JavaScript and css. We follow following rules normally while writing css or js.
- We use proper indentation
- We properly add spaces
- We use enter properly
- We use meaning full names for defining variables
- Write comments wherever we write complex logic
What next? 😦 It will affect the size of the file. File size will be increased and thus increased download time.
Solution is Minification. Minification is a technology which will reduces the size of the file at runtime by removing unnecessary whitespaces, comments and shortening variable names.
How to perform bundling and Minification?
Step 1: Add reference of System.Web.Optimization to your project
Step 2: In global.asax create the bundles as follows
BundleTable.Bundles.Add(new ScriptBundle("~/bundles/jquery").
Include
("~/Scripts/jquery-2.1.1.js", "~/Scripts/jquery.validate.js",
"~/Scripts/jquery.validate.unobtrusive.js"));
Step 3: Enable optimization in global.asaxasfollws
BundleTable.EnableOptimizations = true;
Step 4: In the view include bundle as follows
@Scripts.Render("~/bundles/jquery")
For technical trainings on various topics like WCF, MVC, Business Intelligence, Design Patterns, WPF, TFS and Basic fundamentals feel free to contact SukeshMarla@Gmail.com or visit www.sukesh-marla.com
For more stuff like this, click here. Subscribe to article updates or follow at twitter @SukeshMarla
See following video on implementing ASP.NET (Model View Controller) MVC Web API: –
If you want to learn more about bundling and Minification then go through following video from our www.QuestPond.com
C#, ASP.NET MVC Core, Azure, Angular, Business Intelligence, SQL Server, Data Science - Python Interview Questions & Answers 