Compiling Scripts and Stylesheets

A capability that Assman has had from the beginning is the ability to consolidate your scripts and stylesheets into larger/fewer files. Consolidating scripts and stylesheets is important in any non-trivial website as it minimizes the number of round trips necessary for a browser to render a web page. It is also useful to "minify" your scripts and stylesheets by removing unecessary whitespace and comments. Advanced minifiers can even rename your local and private variables to save space. When you are developing your scripts and stylesheets however, you want to be able to organize the code in as many files as you like. Obviously, you also want to be able to add comments and whitespace to help the readability of the code. Assman can automate this whole process for you so that you can develop and organize the code how you want, and still get the benefit of consolidated and minified files coming down to the browser.

Consolidation

To configure how your resources are consolidated, you can define groups in the Assman.config. Both the <scripts> and <stylesheets> sections of the config file support a <groups> element which can contain one or more <group> elements. Within a group, you can list each individual file that you want to be in the group, or you can define a regular expression that matches against the virtual path of the resources in your website. If you are using regular expressions to include resources in a group, you can also explicitly "exclude" individual resources that otherwise would match the include regex. You can also exclude using a regex. Here is an example of a group definition that does all of the above:

<group consolidatedUrl="~/scripts/consolidated/core.js">
  <include>
    <add path="~/scripts/jquery-1.5.1.js" />
    <add regex="~/views/shared/.+" />
  </include>
  <exclude>
    <add path="~/views/shared/script_i_want_to_exclude.js" />
  </exclude>
</group>

Consolidation by Convention

As you can imagine, on a large site it is quite possible for the configuration of each consolidated group to get a little out of hand. For this reason, Assman also supports defining groups by convention. To define a "convention" group, you need to use special syntax in your consolidatedUrl attribute to define one or more parameters. A parameter is defined using the same syntax as defining parameters in ASP.NET Routing. You surround the parameter with curly braces. Then to define what resources are in the group, you need to define a regular expression that has named groups whose names correspond to the named parameters in the consolidatedUrl. Perhaps its best explained with an example. Here is definition of a convention that will consolidated all script files located in a controllers view folder into a consolidated file named after the controller:

<group consolidatedUrl="~/scripts/consolidated/controllers/{controller}.js">
  <include>
    <add regex="~/views/(?'controller'\w+)/.+" />
  </include>
</group>

Minification

Last edited Jun 30, 2011 at 12:27 AM by andyalm, version 3

Comments

No comments yet.