ASP.NET has in-built for bundling of multiple resources such as js or css files into one file and then minifiy the files to reduce the number of calls made to the server and total data size downloaded from the server thus reducing the total download time and enhanding application’s performance.\u00a0 In order to use this in web forms application which target version .NET 4.5 and higher, following steps are required<\/p>\n
1. Go to NuGet Package Manager and install\u00a0Microsoft.AspNet.Web.Optimization and Microsoft.AspNet.Web.Optimization.WebForms\u00a0packages<\/p>\n
2. Check web.config to make sure “webopt” tag prefix is added (once you install Microsoft.AspNet.Web.Optimization.WebForms)<\/p>\n
<pages>\r\n <namespaces>\r\n <add namespace=\"System.Web.Optimization\" \/>\r\n <\/namespaces>\r\n <controls>\r\n <add assembly=\"Microsoft.AspNet.Web.Optimization.WebForms\" namespace=\"Microsoft.AspNet.Web.Optimization.WebForms\" tagPrefix=\"webopt\" \/>\r\n <\/controls>\r\n<\/pages><\/pre>\n3.\u00a0Add a class file as following and define the resources you want to bundle<\/p>\n
public class BundleConfig\r\n{\r\n public static void RegisterBundles(BundleCollection bundles)\r\n {\r\n Bundle cs = new Bundle(\"~\/bundles\/cssv1\", new CssMinify());\r\n cs.Include(\"~\/Resources\/css\/bootstrap.min.css\",\r\n \"~\/Resources\/css\/app.css\");\r\n bundles.Add(cs);\r\n\r\n bundles.Add(new ScriptBundle(\"~\/bundles\/jsv1\").Include(\r\n \"~\/Resources\/js\/jquery.min.js\", \r\n \"~\/Resources\/js\/bootstrap.min.js\"));\r\n\r\n BundleTable.EnableOptimizations = true;\r\n }\r\n}<\/pre>\n4. Go to Global.asax file and register the bundles<\/p>\n
protected void Application_Start(object sender, EventArgs e)\r\n{\r\n try\r\n {\r\n RegisterRoutes(RouteTable.Routes);\r\n BundleConfig.RegisterBundles(BundleTable.Bundles);\r\n }\r\n catch (Exception ex)\r\n {\r\n \/\/ Log Exception here\r\n }\r\n}\r\n<\/pre>\n5. In order to use these bundles simply use the statements as following<\/p>\n
CSS bundle<\/p>\n
<asp:PlaceHolder ID=\"PlaceHolder1\" runat=\"server\">\r\n <webopt:BundleReference ID=\"Br1\" runat=\"server\" Path=\"~\/bundles\/cssv1\" \/>\r\n<\/asp:PlaceHolder><\/pre>\nJS bundle<\/p>\n
<asp:PlaceHolder ID=\"PlaceHolder1\" runat=\"server\">\r\n <%: Scripts.Render(\"~\/bundles\/jsv1\") %>\r\n<\/asp:PlaceHolder>\r\n<\/pre>\nRead more about this @<\/p>\n