@Blog.Author(Nandip Makwana) .LearningExperience(ASP.NET, ASP.NET MVC, IIS, jQuery & Technology Surrounding it...)

December 24, 2011 comment , , , ,

Creating Custom Transform Type for Bundling and Minification in .NET 4.5

Update:
Originally this article was written after first release of developer preview version of MVC 4. For latest changes in RTM version read ASP.NET 4.5 & MVC 4: Revisiting IBundleTransform

Yesterday, we have learnt how to implement default Bundling and Minification with ASP.NET MVC 4 application as well we also examined how to create custom bundle which bundle and minify only specified files. While creating custom bundle, we suppose to pass transform type to bundle. Microsoft.Web.Optimization assembly shipped with two inbuilt transform type namely JsMinify and CssMinify. In addition to built-in transform type, we can also create our own custom transform type. Today we will examine how to create custom transform type for Bundling and Minification.

To create new transform type, add new class to your MVC 4 or .NET 4.5 application. For e.g. MyJsMinify. Each transform type must implement interface IBundleTransform and Process member function of IBundleTransform interface.

Process method accepts one argument of BundleResponse type. This BundleResponse object is used to retrieve list of files included in bundle. Once we process retrieved files, we will assign processed response back to BundleResponse so it can send it back to browser.

Update:
Originally this article was written after first release of developer preview version of MVC 4. For latest changes in RTM version read ASP.NET 4.5 & MVC 4: Revisiting IBundleTransform

BundleResponse class has 4 properties. Each of them is as follow.

BundleResponse.Files

This is IEnumerable collection of files which is included in bundle.

BundleResponse.ContentType

Through this property, we can set content type for bundle so that browser can render it appropriately. Default content type "text/html".

BundleResponse.Cacheability

We can use this property to set Cache-Control HTTP header of bundled response.

BundleResponse.Content

Anything which we set as a value of this property, that content will be sent back to browser as a response of bundle. We have examined each property of BundleResponse class. So basic steps for creating custom transform type is iterate through each file of BundleResponse.Files, process it and assign it back to BundleResponse.Content. And finally set appropriate content type and cache control if it is required.

Complete code for custom transform type is given below.

public class MyJsMinify : IBundleTransform
{
    public void Process(BundleResponse bundle)
    {
        string strAllJS = string.Empty;
        // Collect content of each included files
        foreach (FileInfo obj in bundle.Files)
        {
            StreamReader srCSSFile = new StreamReader(obj.FullName);
            strAllJS += srCSSFile.ReadToEnd();
            srCSSFile.Close();
        }
        // Process gathered content or
        // process indivisual file in
        // loop and finally assign it back
        bundle.Content = strAllJS;
        bundle.ContentType = "text/javascript";
        bundle.Cacheability = HttpCacheability.Public;
    }
}

Finally we can use custom transform type as we were using built-in transform type!!!

Bundle myJSBundle = new Bundle("~/MyJSBundle", typeof(MyJsMinify));

Hope this would be helpful.

Update:
Originally this article was written after first release of developer preview version of MVC 4. For latest changes in RTM version read ASP.NET 4.5 & MVC 4: Revisiting IBundleTransform

comments powered by Disqus

Featured Content

Resources & Tools

About Nandip Makwana

Nandip Makwana is passionate about digital world and web. He completed his Masters in Computer Application in June 2011. Currently he is working as a Software Engineer. He has shown great promise and command over ASP.NET and technologies surrounding it during his academic years and professorial life...continue reading