Requirements for an Assetic module in ZF2

Requirements.md

Assetic module in ZF2

This file describes my opinion of the integration of a public asset management tool within Zend Framework 2. It doesn't necessarily involve Assetic, but because Assetic is the most advanced and most used tool, I will focus on that. There is already an alternative module for Assetic integration, but the configuration of this module strikes 100% against my opinion of usage patterns. Therefore I write this document, to open up the discussion about improvements of zf2-assetic-module or write an alternative module.

Main usage pattern

The people using asset management tools are probably the frontend developers, as they write the html code in views, layouts etc. Currently they use helpers like headLink, headScript and inlineScript to control the assets. Starting point for this text is their workflow should not change as much as possible.

This means, an Assetic module should override the view helpers plugin broker, providing alternatives to headLink, headScript and inlineScript. This boils down to this: using Assetic for the most simple use cases (css and js files) should be independent of the view scripts. When enabled, the module provides more features like all the filters from Assetic (LESS compilation, YUI compression, file merging).

Development versus production environment

In a production environment, assets must be merged, minified, compressed and cached when possible. However, during development for the sake of clarity these files should not be processed. The current methods of *.local.config.php configuration files should make this deviation possible with a separate configuration on a development environment than a production environment.

Examples

All examples below are not definitive and highly

$config = array(
  'di' => array(
    'instance' => array(
      'assetic' => array(
        'parameters' => array(
          'styles' => array(
            'default' => array(
              'filters' => array(),
              'collection' => false
            ),
            'less' => array(
              // Define filters
              'filters' => array('LessPHP', 'CssMinFilter', 'Yui\CssCompressorFilter'),

              // Files will be grouped together as one http request is now required
              'collection' => true
            ),
          ),
          'js' => array(
            //  For javascript files something similar can be achieved
            'default' => array()
          ),
        ),
      ),
    ),
  ),
);

Usage in view scripts:

<!-- It is possible to use the headLink syntax -->
<?= $this->plugin('headLink')->appendStylesheet('my/style.css') /** Default group */?>

<!-- However, the assetic plugin provides advanced control -->
<?= $this->plugin('assetic')->appendStylesheet('my/less/foo.less', 'less') /** Less group */
                            ->appendStylesheet('my/less/bar.less', 'less')?>