Bundler

The bundler is a feature of Berlioz that automatically associates styles and scripts to a service and bundles them in an efficient manner for Web delivery.

In order to the advantage of the bundler without having to do some additional configuration, it is best to follow the standard file layout.

Features

The bundler is in fact a generator designed to bundle resources for better efficiency based on the service in use.

  • Concatenate and minimizes scripts and styles
  • Resolves @import rules in CSS
  • Inline images with base 64 in CSS
  • Detect changes in files
  • Provide path to optimized scripts and styles
  • Optimized files can be cached for eternity

Uses the Berlioz context (group and service) to determine styles and scripts to load

Default configuration

The default configuration will load the CSS and scripts defined for the entire application, for the service that corresponds to the request made as well as for the group of services it belongs to.

StylesScripts
/style/global.css/script/global.js
/style/[group].css/script/[group].js
/style/[group]/[service].css/script/[group]/[service].js

Note

These files don't have to exist, but if they do, the bundler will process them

Example

Let's assume we have service mapped to /user/{username} which ID is 'get-user' and that is part of the 'default' group of services.

A user makes the following request:

GET /user/jsmith.html

First, the bundler would look for the following files:

StylesScripts
/style/global.css/script/global.js
/style/default.css/script/default.js
/style/default/get-user.css/script/default/get-user.js

Then, it would process the files that exists and store them on the server at /style/_/ appending a unique values so that it can be cached.

  • /style/_/global-2015-04-29-56e3.min.css
  • /style/_/default-2015-04-29-a44f.min.css

Finally, it returns URL in the generator output:

<style src="/style/_/global-2015-04-29-56e3.min.css" bundled="true" minimized="true"/>
<style src="/style/_/default-2015-04-29-a44f.min.css" bundled="true" minimized="true"/>

The XSLT module can use these values to link the bundled styles in HTML.

Created on , last edited on