Bundling and Minification

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.)

Bundling is a new feature in ASP.NET 4.5 that makes it easy to combine or bundle multiple files into a single file. You can create CSS, JavaScript and other bundles. Fewer files means fewer HTTP requests and that can improve first page load performance.

Minification performs a variety of different code optimizations to scripts or css, such as removing unnecessary white space and comments and shortening variable names to one character.

It's easy to debug your JavaScript in a development environment (where the compilation Element in the Web.config file is set to debug="true" ) because the JavaScript files are not bundled or minified.
```
<system.web>
    <compilation debug="true" />
    
</system.web>
```

To enable bundling and minification, set the debug value to "false". You can override the Web.config setting with the EnableOptimizations property on the BundleTable class. The following code enables bundling and minification and overrides any setting in the Web.config file.

public static void RegisterBundles(BundleCollection bundles)
{
    bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                 "~/Scripts/jquery-{version}.js"));

    // Code removed for clarity.
    BundleTable.EnableOptimizations = true;
}

Note: Unless EnableOptimizations is trueor the debug attribute in thecompilation Element in the Web.config file is set to false, files will not be bundled or minified. Additionally, the .min version of files will not be used, the full debug versions will be selected. EnableOptimizations overrides the debug attribute in thecompilation Element in the Web.config file

<system.web>
    <compilation debug="false" />
</system.web>

But this would disable debug mode (entire application) entirely so I would recommend the first option.
(EnableOptimizations will overwrite the change in web.config)

Finally, to get the best of both worlds, use the #if compiler directive like this:

#if DEBUG
            BundleTable.EnableOptimizations = false;
#else
            BundleTable.EnableOptimizations = true;
#endif

Additional Notes: Selecting “.min” file for release when “FileX.min.js” and “FileX.js” exist. Selecting the non “.min” version for debug. Ignoring “-vsdoc” files (such as jquery-1.7.1-vsdoc.js), which are used only by IntelliSense.

Bundling framework is smart to select the ".min" version

Bottom line: Remove any .min files that you are not actively managing.

http://stackoverflow.com/questions/11980458/bundler-not-including-min-files

Microsoft implies the following behavior (and I prefer to follow it in my projects):
short version

    You have both debug and minified versions of a script in your project under the same folder:
        script.js
        script.min.js
    You add only script.js to a bundle in your code.

As a result you will automatically have the script.js included in DEBUG mode and script.min.js in RELEASE mode.
long version

You can have also .debug.js version. In that case the file is included in the following priority in DEBUG:

    script.debug.js
    script.js

in RELEASE:

    script.min.js
    script.js

note

And by the way, the only reason to have a .min versions of your scripts in MVC4 is the case when the minified version can not be processed automatically. For example the following code can not be obfuscated automatically:

if (DEBUG) console.log("Debug message");

In all the other cases you can go with just a debug version of your script.

Bundling and Minification

Bundling and Minification

results matching ""

No results matching ""