Solving development problems  |  About this blog

Combine Javascript and CSS in one request, minimization and optimization in ASP.NET MVC

There is an Combres project that can help you achieve this goal: http://combres.codeplex.com/

Here is a tutorial how to use it:

http://www.codeproject.com/KB/aspnet/combres2.aspx

1. Put this in web.config:
<configuration>
<configSections>
<section name="combres" type="Combres.ConfigSectionSetting, Combres, Version=2.0.0.0, Culture=neutral, PublicKeyToken=49212d24adfbe4b4"/>
...
</configSections>
<combres definitionUrl="~/App_Data/combine.xml"/>
...
</configuration>

2. Put this in Global.asax
At the top put this:

using Combres;



And then in the Application_Start put this:


protected void Application_Start()
{
//Apply combres compression
RouteTable.Routes.AddCombresRoute("Combres Route");
}

3. Add a reference in your project to merged Combres.dll library.

4. Create an xml file (named it as it is in web.config and put it in specified location):

<?xml version="1.0" encoding="utf-8" ?>
<combres xmlns='urn:combres'>
<resourceSets url="~/combres.axd" defaultDuration="30" defaultVersion="11">
<resourceSet name="siteCss" type="css">
<resource path="~/Styles/jquery.paginate.css" />
<resource path="~/Styles/general.css" />
<resource path="~/Styles/redmond/jquery-ui-1.8rc3.custom.css" />
<resource path="~/Styles/jquery.fancybox-1.3.0.css" />
<resource path="~/Styles/jquery.ratings.css" />
</resourceSet>
<resourceSet name="siteJs" type="js">
<resource path="~/Scripts/jquery-1.4.2.min.js" />
<resource path="~/Scripts/jquery-ui-1.8rc3.custom.min.js" />
<resource path="~/Scripts/jquery.ratings.js" />
<resource path="~/Scripts/jquery.paginate.js" />
<resource path="~/Scripts/jquery.apag.js" />
<resource path="~/Scripts/fancybox/jquery.easing-1.3.pack.js" />
<resource path="~/Scripts/fancybox/jquery.mousewheel-3.0.2.pack.js" />
<resource path="~/Scripts/fancybox/jquery.fancybox-1.3.0.pack.js" />
<resource path="~/Scripts/swfobject.js" />
</resourceSet>
</resourceSets>
</combres>

5. In the HEAD of yout HTML or master page call this:

<head runat="server">
<title>Some title...</title>
<%= Combres.WebExtensions.CombresLink("siteCss")%>
<%= Combres.WebExtensions.CombresLink("siteJs")%>
</head>

blog comments powered by Disqus