Hi Shannon

Thanks for the update - I knew about the CDF but not really given it enough time to play with if i'm honest. Tried to use it a couple of time but found it fiddly (was a few months ago now) and heard from a few other peeps issues with using it, setting up etc which I never really looked into

I then came across some code that suited my needs and used it on my site, results were impressive enough so I rolled it out as a package for others to use - just another option I guess

I'll be getting some time over the coming weeks to check out some of the CDF features in more detail so I may well defect from my own package, lets see :-)

Cheers

Si

Cool, please let me know if you have any questions/problems, etc... with it and please make sure you use the latest version. Its definitly more performant to register your scripts/styles with the framework itself because of the combination which can actually make your websites load much faster due to far less requests (most browsers can only make a couple requests at a time to the same domain).

That said, its some great work on sharing your project with the community!

Looking forward to any feedback you might come up with.

Cheers,Shannon

Hi Shannon,

Thanks for this. Is there any specific documentation on implementing the Client Dependency Framework for an Umbraco website?

greetings,

Anthony Candaele
Belgium 

Hey sorry for the delay, there's not specific documentation on how to use it with Umbraco because it doesn't really matter if you are using it with Umbraco or any other website. There's some documentation on CodePlex here:

http://clientdependency.codeplex.com/documentation

Essentially there are 2 ways to get started:

1. If you already have a site built and are using <script, <link tags and you dont want to re-register them all with CDF, then you can just enable 'Rogue File Detection' in the ClientDependency.config file (you will already have this config file in umbraco at ~/config/ClientDependency.config ). You'll see a section called 'rogueFileCompression'. It allows you to filter out which pages that the detection will be used in, off the top of my head i can't remember what is set there by default when shipped with Umbraco but i think its 'disabled' as to not interfere with Umbraco users' pages if they dont want it. Its really easy to enable, here's an example, this will say enable rogueFileCompression for all pages (*) to detect files with the specified extensions except any pages that contain test.aspx (which is just a regex). This gives you full control over which pages this is enabled for.

    <rogueFileCompression>
      <add path="*" compressJs="true" compressCss="true" jsExt=".js,asmx/js" cssExt=".css">
        <exclusions>
          <add path="^.*test.aspx.*" />
        </exclusions>
      </add>
    </rogueFileCompression>

2. The better way to use CDF is to register your files with CDF instead of using <script or <link tags. This is so you get file combination. The way to do this varies based on whether you use WebForms or MVC (MVC syntax is much nicer btw).  To get started quickly you'll need to know 2 things:

File registration for CSS and JS (examples):  

<CD:CssInclude ID="CssInclude1" runat="server" FilePath="~/CSS/Content.css" />

<CD:JsInclude ID="JsInclude1" runat="server" FilePath="~/Js/jquery-1.3.2.min.js" />

There's a bunch of other options you can specify as well... some documentation is here (though some stuff is missing from those docs like grouping)

http://clientdependency.codeplex.com/wikipage?title=FileRegistration&referringTitle=Documentation

You can declare registrations anywhere in any of your controls, pages, etc... and CDF will handle duplicate registrations for you. The underlying purpose of CDF wasnt to acheive compression/combination/minification but to give you very flexible/powerful control of managing your 'client dependencies' especially when working in teams where each person is building their own controls.

The next thing you'll need to do is get these dependencies rendered out somewhere. This declaration can only be declared once per page and normally will go on your master page or something:

<CD:ClientDependencyLoader runat="server" id="Loader" />

There's more options you can specify for that one too (again, refer to the docs). 

And thats it! Normally you'd have to make sure your web.config is setup correctly but since you're using Umbraco it's already done for you.

Hope that helps :)

@Shannon or anyone else,

Can you exclude certain CSS or JS files from being compressed using ClientDependency using the rogueFileCompression.  I assume you could do it doing the

<CD:CssIncludeID="CssInclude1"runat="server"FilePath="~/CSS/Content.css"/>

<CD:JsIncludeID="JsInclude1"runat="server"FilePath="~/Js/jquery-1.3.2.min.js"/>

@Shannon or anyone else,

Sorry about my last post. Hit the Submit button too early. Anyways.

Can you exclude certain CSS or JS files from being compressed using ClientDependency using the rogueFileCompression?  I assume you could do it doing the

<CD:CssIncludeID="CssInclude1"runat="server"FilePath="~/CSS/Content.css"/>

<CD:JsIncludeID="JsInclude1"runat="server"FilePath="~/Js/jquery-1.3.2.min.js"/>

But we have a lot of templates with a bunch of CSS and JS files in them already.

Also, does it actually combine the all the files into one? or does it just minify the files. I notice the numbers it generated when it was turned on, each file has a different number.  Are they actually combined? or just compressed within themselves?

Someplace I read it compresses CSS within <style> tags within a aspx page. Does that work too?

Thanks in advance

Yes, you can customize which files are compressed in rogueFileCompression in the config. See the docs:

http://clientdependency.codeplex.com/wikipage?title=Configuration&referringTitle=Documentation

and have a look at the rogueFileCompression config section and info below. You can target which paths will be scanned for inclusion in rogueFileCompression.

It is much better to use CDF without rogueFileCompressions because you get the benefits of combination as well as all of the APIs, whereas rogueFileCompression will just post process your html and replace your regular script/css tags with compressed/minified versions of them.

Currently it will not compress inline <style> tags... well as far as I know :) there's been some additional devs working on the project so they may have implemented this but I haven't seen it.

is working on a reply...