Cassette | Asset bundling for .NET web apps

Asset bundling for .NET web apps

Dumping your scripts into a folder is no way to manage your client-side code!

Cassette automatically sorts, concatenates, minifies, caches and versions all your JavaScript, CoffeeScript, CSS, LESS, Sass and HTML templates.

It's flexible, extensible and optimized for developer happiness.

Download

“Yeah! Getting some time to experiment with @getcassette to improve the performance of our websites even more!”

via @jaspio

“Thanks for making my life as dev so easy!! getcassette.net via @getcassette”

via @peitor

Easy to use

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

Reference the scripts you directly require.

Tell Cassette where to render the <script> tags.

Stylesheets and HTML Templates are also supported

@{
  Bundles.Reference("Scripts/app/page.js");
}
<!DOCTYPE html>
<html>
<head>
  <title>Web App</title>
  @Bundles.RenderScripts()
</head>
<body>
  ...
</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 SHA-1 hash is used. The output here has been shortened to fit on screen.

<!DOCTYPE html>
<html>
<head>
  <title>Web App</title>
  <script src="/Scripts/lib/jquery.js?a4babad4b" type="text/javascript"></script>
  <script src="/Scripts/lib/jquery-ui.js?53dd39212" type="text/javascript"></script>
  <script src="/Scripts/app/tools.js?4d03ae0b" type="text/javascript"></script>
  <script src="/Scripts/app/widgets.js?cf319fe0b" type="text/javascript"></script>
  <script src="/Scripts/app/page.js?485f05e21" type="text/javascript"></script>
</head>
<body>
  ...
</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>
  <script src="/_assets/scripts/Scripts/lib_4bad47afb" type="text/javascript"></script>
  <script src="/_assets/scripts/Scripts/app_b7c29fecc" type="text/javascript"></script>
</head>
<body>
  ...
</body>
</html>

So much more...

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

CoffeeScript is built-in. Just add .coffee files to your project and Cassette will compile them.
LESS files are automatically compiled into CSS.
Cassette has an extensible "asset pipeline". Learn how to extend and customize asset processing.

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

Download