main banner

Content Management

Getting Combres to Work on Sitecore 7

Combres is a tool that lets you minify, compress and set some useful headers to JavaScript and CSS files. This improves performance by creating smaller pages and making use of browser cache, when available.


From their website: "Combres helps your ASP.NET and ASP.NET MVC applications perform faster and rank better with YSlow and PageSpeed". I did some tests and this is true. This tool does make the website perform better and rank better with YSlow and PageSpeed. However, it is not easy to make it play nice with Sitecore 7.

I found an old post by Alexander Doroshenko on how to make Combres work with Sitecore 6.4/6.5, but that does not work anymore. Combres has released newer versions since then and so does Sitecore. After trying to make this work for some hours, I finally ran into this blog by Mikael Högberg on how to make it work for Sitecore 6.6. It turns out the IHttpHandler Combres uses is synchronous and Sitecore now only works with asynchronous handlers.

Here are the steps you need to follow in order to get it to work with Sitecore 7.  

1. Backup your web.config (really important).

2. Install Combres from NuGet:

PM> Install-Package combres

This will add the references you need to your project and create a new class (App_Start/Combres.cs) and the Combres configuration file (App_Data/combres.xml). It also adds 2 different configuration examples (combres_full_with_annotation.xml and combres_minimal.xml).

3. In Visual Studio, delete the App_Start folder (including the Combres.cs file beneath it).

4. There's a good chance combres was not able to update your web.config file. Even if it did, replace the web.config with the backup you made on step one. Then, you need to add the following configSection:

<section name="combres" type="Combres.ConfigSectionSetting, Combres, Version=2.2, Culture=neutral, PublicKeyToken=1ca6b37997dd7536" />

Then add the combres section inside configuration:

<combres definitionUrl="~/App_Data/combres.xml" />

5. Update the IgnoreUrlPrefixes setting and append it with "/combres.axd".

6. Add the Combres namespace to system.web/pages/namespaces:

<add namespace="Combres" />

7. Add the following assembly binding to the runtime section:

<dependentAssembly>
  <assemblyIdentity name="AjaxMin" publicKeyToken="21ef50ce11b5d80f" culture="neutral" />
  <bindingRedirect oldVersion="0.0.0.0-4.84.4790.14405" newVersion="4.84.4790.14405" />
</dependentAssembly>

8. As described in Mikael Högberg's post, you need to create a new class that registers the Combres route after MVC routes are processed. 

public class InitializeCombres
{
    public virtual void Process(PipelineArgs args)
    {
        RouteTable.Routes.AddCombresRoute("Combres");
        RouteBase combresRoute = RouteTable.Routes["Combres"];
        RouteTable.Routes.Remove(combresRoute);
        RouteTable.Routes.Insert(0, combresRoute);
    }
}

9. Add the config file to the App_Config/Include folder to register the class. Name this file ZCombres.config. Why name it like that? Here is why.

Sitecore processes configuration patch files (inside App_Config/Include folder) in alphabetical order. If you name this file Combres.config, it will be processed before Sitecore MVC's patch file (Sitecore.MVC.config), so the Sitecore MVC initializers will be included after the Combres initializer. We need the Combres initializer to run after Sitecore MVC's pipeline initialization (Sitecore.Mvc.Pipelines.Loader.InitializeRoutes, Sitecore.Mvc). 

<?xml version="1.0" encoding="utf-8" ?>
<configuration xmlns:patch="http://www.sitecore.net/xmlconfig/">
  <sitecore>
    <pipelines>
      <initialize>
        <!-- This must be after Sitecore.Mvc.Pipelines.Loader.InitializeRoutes -->
        <processor patch:after="processor[@type='Sitecore.Mvc.Pipelines.Loader.InitializeRoutes, Sitecore.Mvc']" type="Sitecore7.InitializeCombres, Sitecore7"/>
      </initialize>
    </pipelines>
  </sitecore>
</configuration>

10. Configure the bundles you want to create in the App_Data/combres.xml file. Be sure to take a look at App_Data/combres_full_with_annotation
.xml to see all the options you can set in the configuration file.

11. Add your bundles to your layout(s):

<%= WebExtensions.CombresLink("siteCss") %>
<%= WebExtensions.CombresLink("siteJs") %>

That's it. Enjoy.

Eduardo M.

Born and raised in Mexico City, Eduardo has over 15 years of experience, 6 working with Java, 8 with .NET and 5 with Sitecore and other CMS. He is an Electronic Systems Engineer who enjoys tennis and has written some pretty cool blog entries you should read.

Articles