CODEWITHSUNDEEP
asp.net-mvc
prisoner24601
prisoner24601

Reputation: 249

How exactly does CSS/Javascript minification and bundling work in MVC?

I'm a little confused as to how MVC handles CSS and Javascript, and I have a few questions.

Whenever I create a default MVC (5) application, I see that there are already a number of CSS and Javascript libraries added, with both normal and minified versions.

When I look at the BundleConfig class, I see that the regular files are bundled together, but the minified versions are not.

When are the minified versions actually used? When I debug the site, or even deploy it to a server, I never see these being used. Is this something I have to change myself, or is there a setting for this?

Also, do I need to keep the regular and minified versions of these files in sync, or is this something MVC can do automatically?

Thanks

Upvotes: 4

Views: 825

Answers (2)

Sampath
Sampath

Reputation: 65860

Bundling

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

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.

Your Question ?

When I look at the BundleConfig class, I see that the regular files are bundled together, but the minified versions are not.

Answer :

You don't need to include minified versions into bundle.B'cos bundling itself does this (minification) at the time when your app's status is release.By default Debug mode will use non minified version.

Your Question ?

When are the minified versions actually used? When I debug the site, or even deploy it to a server, I never see these being used. Is this something I have to change myself, or is there a setting for this?

Answer :

Minified version will use at the time app is on production (or release mode). You don't need to do anything here.It does automatically when you change the App's status as release.

Your Question ?

Also, do I need to keep the regular and minified versions of these files in sync, or is this something MVC can do automatically?

Answer :

You don't need to do anything here.It does automatically by the framework.

Important Note :

You don't need to add minified files into bundles.B'cos bundled files will be automatically minified when app status is on release mode.Please read below thread for more info.

Bundle vs Minification,Which one is the best

Upvotes: 2

trailmax
trailmax

Reputation: 35106

By default, if your app is built with Debug option, bundling and minification takes unminified versions. If site is built in Release mode, minified versions of files are taken, where available.

On top of that you can enforce minification yourself by having

BundleTable.EnableOptimizations = true;

in your BundleConfig class. This enables minification for all the bundles for you. To have this minification only in releases I usually do compiler condition: 

#if !DEBUG
     BundleTable.EnableOptimizations = true;
#endif

And it is very recommended to read the documentation already linked in comments

Upvotes: 0

Related Questions