Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles / web / HTML

Minify contents - Reduce page size

4.75/5 (4 votes)
19 Jul 2012CPOL2 min read 32.6K   1.8K  
A library to minify HTML and CSS content.

Introduction 

Minify content library is used to reduce the response content in ASP.NET. Response content can be in a form of HTML, CSS or JavaScript. When response is generated by server, it contains unnecessary text like tabs, spaces and new line characters. This library will remove all these unnecessary text with minifying in single line. It will reduce the page size as well. This library will minify the HTML and CSS content.

How to use it? 

It is easy to use this library. Download the MinifyContent library source project. Build the project in release mode. Add reference of MinifyContent.dll in the Asp.Net web application.

Image 1

Image 2

Once the dll has been added to the project, register the ContentCompresser module in web.config file. This HTTP Module is responsible to minify the content.

Register Module in Web Config

That’s all. It’s time to run the application now. Once the page has been loaded in browser, verify the HTML contents.

Verify HTML contents

Opps!!! The HTML contents are not minified, are we missing something?

As a developer we use to run application in debug mode and many times we debug the JavaScript at the time of development and hence we do not want to minify the HTML contents. So what to do to minify it? Simple, for now just change the execution mode of application from Debug to Release; from Standard toolbar or from Configuration Manager screen. Now run the application and verify the HTML contents once the page has been loaded in browser. 

Are the Contents minified this time?

No. What’s wrong now?

It should minify this time as the web application has been run in Release mode!!!

Check the web.config file. Under System.web section group, in Compilation Section; check the value of debug attribute. If it is true, change the value to false.

Change debug false in web.config

All is completed and run the application now. Observe that contents are minified.

Verify HTML contents

Some statistics of minified default.aspx page.

Content Type Size in Bytes
BeforeAfter
HTML 24201992
CSS 42583240
Total 66785232
Difference 1.42 KB
Difference in % 21.78%

Points of Interest 

History

  • 19th July, 2012: Initial post. 

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)