Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is there any reason to have multiple ScriptBundle bundles in BundleConfig?

Here, the default MVC5 App BundleConfig:

public class BundleConfig
{
    // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js"));

        bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.validate*"));

        // Use the development version of Modernizr to develop with and learn from. Then, when you're
        // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
        bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                    "~/Scripts/modernizr-*"));

        bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                  "~/Scripts/bootstrap.js",
                  "~/Scripts/respond.js"));
    }
}

Wouldn't it be much simpler to have just one bundle, where you will include all the scripts you need? like this:

public class BundleConfig
{
    // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new ScriptBundle("~/bundles/scripts").Include(
                    "~/Scripts/jquery-{version}.js",
                    "~/Scripts/jquery.validate*",
                    "~/Scripts/modernizr-*",
                    "~/Scripts/bootstrap.js",
                    "~/Scripts/respond.js"));
    }
}

Or, even simpler, like this (in Script folder you only put JS files you need):

public class BundleConfig
{
    // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new ScriptBundle("~/bundles/scripts").Include("~/Scripts/*"));
    }
}
like image 352
monstro Avatar asked Mar 13 '16 13:03

monstro


People also ask

What is the benefit of bundling .js scripts into one file?

JavaScript bundling is an optimization technique you can use to reduce the number of server requests for JavaScript files. Bundling accomplishes this by merging multiple JavaScript files together into one file to reduce the number of page requests.

What is the advantage of bundling in MVC?

The MVC provides us the two features to reduce the number of requests to access the resource file on the server i.e. Bundling and Minification. Bundling is one of the features of MVC. By implementing this, we can improve performance request load time.

What is difference between bundling and minification?

Bundling and minification are two techniques you can use in ASP.NET to improve page load performance for your web application. Bundling combines multiple files into a single file. Minification performs a variety of different code optimizations to scripts and CSS, which results in smaller payloads.

Why do we use bundling?

Bundling enables you to sell more and decrease marketing and distribution costs. Instead of marketing every product you can group complementary products together and market them as a single product. By packaging different items together you only need one warehouse bin to store them instead of different bins.


1 Answers

Wouldn't it be much simpler to have just one bundle, where you will include all the scripts you need?

This might simplify the development process slightly as you do not need to look for corresponding bundle to include. But lets look at this from another perspective.

On asp.net forum the following it is witten:

Bundling and minification are two techniques you can use in ASP.NET 4.5 to improve request load time. Bundling and minification improves load time by reducing the number of requests to the server and reducing the size of requested assets (such as CSS and JavaScript.)

So we do bundling to make things work faster. What if you've created a page with a simple form where no bootstrap.js is needed. Why would you load it then provided you are interested in speeding everything up?

The best performance option is to have all possible js files combinations you might require in one place in separate bundles. Each page make only one request to get all js it needs. However this way of things is rather difficult to maintain.

So it's up to you to decide which aspect you are interested in.

like image 126
Ivan Gritsenko Avatar answered Sep 19 '22 10:09

Ivan Gritsenko