Simple install via nuget

Also choose from a wide selection of plug-ins that enhance Cassette.

Install-Package Cassette.Aspnet
Install-Package Cassette.Less
Install-Package Cassette.Sass
Install-Package Cassette.CoffeeScript

View all plug-ins

Elegant configuration API

Tell Cassette how to bundle your assets with just a few lines of code.

Cassette does the hard work of finding the files, sorting, compiling and minifying.

public class CassetteConfiguration : IConfiguration<BundleCollection>
{
    public void Configure(BundleCollection bundles)
    {
        bundles.Add<StylesheetBundle>("Content", bundle => bundle.EmbedImages());
        bundles.AddPerSubDirectory<ScriptBundle>("Scripts");
    }
}

Reference and Render

Cassette's Bundles helper works in view pages, layouts and partials.

Reference the assets or bundles you directly require.

Tell Cassette where to render the HTML.

@{
  Bundles.Reference("content");
  Bundles.Reference("scripts/app/page.js");
}
<!DOCTYPE html>
<html>
<head>
  <title>Web App</title>
  @Bundles.RenderStylesheets()
</head>
<body>
  ...
  @Bundles.RenderScripts()
</body>
</html>

Debug runtime output

When debug="true" in Web.config:

  • Cassette detects file references.
  • All the required scripts are included in the correct order.
  • The hash of each file is appended to each URL as a "cache-breaker".

The base-64 encoded SHA-1 hash is used.

<!DOCTYPE html>
<html>
<head>
  <title>Web App</title>
  <link href="/cassette.axd/asset/content/reset.css?3W7p4f6HTcITLRa0Cxw2tJxQQAM=" rel="stylesheet" type="text/css"/>
  <link href="/cassette.axd/asset/content/site.css?X4W1S2W16tuRbadn-SKWmE_nJT0=" rel="stylesheet" type="text/css"/>
</head>
<body>
  ...
  <script src="/cassette.axd/script/scripts/lib/jquery.js?JD8viSwogmMYMx55J-RsipVxTjo=" type="text/javascript"></script>
  <script src="/cassette.axd/script/scripts/lib/jquery-ui.js?PlxtfG4Jll0234wePZ3KZGLEHsE=" type="text/javascript"></script>
  <script src="/cassette.axd/script/scripts/app/tools.js?hxLaF5kjfuSZPND55dxgnv8BVos=" type="text/javascript"></script>
  <script src="/cassette.axd/script/scripts/app/widgets.js?vDM6NPLt8F_cyE-4QxtJE-Jj9RY=" type="text/javascript"></script>
  <script src="/cassette.axd/script/scripts/app/page.js?idIQWW6yfM-kcZLxL4w8sJbmMYA=" type="text/javascript"></script>
</body>
</html>

Production runtime output

With a single change to Web.config, debug="false", Cassette switches into high performance mode.

  • Cassette concatenates and minifies the scripts into "bundles".
  • HTTP output is compressed.
  • Aggressive cache headers are sent. So browsers download each bundle only once.
  • Hash included in the URL. So new versions have different URLs.
<!DOCTYPE html>
<html>
<head>
  <title>Web App</title>
  <link href="/cassette.axd/style/1mN6dL9x3GVgFSN2kzWWoPiWukg=/content" rel="stylesheet" type="text/css"/>
</head>
<body>
  ...
  <script src="/cassette.axd/script/LNWSFkY-CptfRoJ5Tr7AWA3obwY=/scripts/lib" type="text/javascript"></script>
  <script src="/cassette.axd/script/rAcu6xcghTyKVFDzaXr8obTTJ6Y=/scripts/app" type="text/javascript"></script>
</body>
</html>

So much more...

This introduction has only scratched the surface of what Cassette can do.

  • Treat your client-side HTML templates as bundles.
  • Add CoffeeScript support by installing the Cassette.CoffeeScript nuget package.
  • Add Less and Sass support by installing Cassette.Less and Cassette.Sass.
  • Cassette provides extensible bundle "pipelines" that allow full control over how bundles are processed.

Get Cassette! It's free, open source software, distributed under the MIT License.

Download