{% extends "../../layout.html" %} {% block sectionClasses %}plugins hasBreadCrumb plugins-spincast-css-yuicompressor{% endblock %} {% block meta_title %}Plugins - Spincast CSS YUI Compressor{% endblock %} {% block meta_description %}Spincast CSS YUI Compressor plugin - YUI Compressor integration to minify/compress your CSS.{% endblock %} {% block scripts %} {% endblock %} {% block body %}
  1. Plugins
  2. Spincast CSS YUI Compressor plugin

Spincast CSS YUI Compressor plugin

Spincast CSS YUI Compressor plugin

Overview

A small plugin that simply wraps YUI Compressor so you can compress CSS. It removes spaces, newlines, etc. This leads to faster load time for your webpages.

Note that this plugin only provides the CSS compression feature of YUI Compressor, not its ability to also compress Javascript. The reason is that YUI Compressor is not up to date in regard to Javascript...

We will soon release another plugin that will wrap Google Closure Compiler: and this will be our recommendation on how to minify Javascript!

Usage

You inject and use the SpincastCssYuiCompressorManager component to minify your CSS.

Let's say you have a dynamic resource route that serves your CSS files dynamically:

{% verbatim %} 

router.dir("/publicdyn/css/*{relativePath}")
      .pathRelative("/publicdyn/css")
      .handle(publicResourcesController::dynCss);
{% endverbatim %}

In the "dynCss(...)" handler, you would get the raw content of the CSS file and tweak it using the SpincastCssYuiCompressorManager component before sending it:

{% verbatim %} 

File rawCssFile = //... get the raw CSS file

String cssContent = FileUtils.readFileToString(rawCssFile, "UTF-8");

String cssMinified = getSpincastCssYuiCompressorManager().minify(cssContent);

context.response().sendCharacters(cssMinified, "text/css");
{% endverbatim %}

Explanation :

  • 1 : We get the raw CSS file using the "relativePath" path parameter taken from the request. We make sure we validate this user input properly!
  • 3 : We get the raw CSS content.
  • 5 : We call the minify(...) method.
  • 7 : We send the minified CSS, using the proper content-type.

SpincastCssYuiCompressorManager methods
The main methods provided by SpincastCssYuiCompressorManager are:
  • String minify(String cssContent)

    Run YUI Compressor on the specified CSS content, as a String. Returns the compressed CSS.

  • void minify(File cssFile)

    Run YUI Compressor on the specified CSS file. The file will be modified and will contain the compressed CSS.

There is one extra option available on both methods: lineBreakPos. Here is the documentation about this option, taken directly from YUI Compressor documentation (search for "--line-break"):

"Some source control tools don't like files containing lines longer than, say 8000 characters. The linebreak option is used in that case to split long lines after a specific column. It can also be used to make the code more readable, easier to debug (especially with the MS Script Debugger) Specify 0 to get a line break after each semi-colon in JavaScript, and after each rule in CSS."

Configurations

This plugin has no global configuration.

Installation

1. Add this Maven artifact to your project: 

<dependency>
    <groupId>org.spincast</groupId>
    <artifactId>spincast-plugins-css-yuicompressor</artifactId>
    <version>{{spincast.spincastCurrrentVersion}}</version>
</dependency>

2. Add an instance of the SpincastCssYuiCompressorPlugin plugin to your Spincast Bootstrapper: {% verbatim %} 


Spincast.configure()
        .plugin(new SpincastCssYuiCompressorPlugin())
        // ...

{% endverbatim %}

{% endblock %}