In the next release of DADI Web, version 5.0, we’ll be adding a small but powerful new feature we’re calling ‘post processors’ (borrowed from a little known Wordpress feature).
For example you may want to enforce a style-guide amongst several editors, such as enforcing typographers quotes or converting units of measurement automatically for different audiences.
One use we’ve been finding it particularly useful for is minifying the HTML output of a website.
🔗Example
This process is very straightforward thanks to a NPM package called html-minifier, so let’s go ahead and install that in our project:
npm install html-minifier
Next we will create a file event in the new workspaces folder processors.
workspace/processors/minify-html.js
const minify = require('html-minifier').minify
module.exports = (data, output) => {
return minify(output, {
collapseWhitespace: true,
minifyCSS: true,
minifyJS: true,
removeRedundantAttributes: true,
useShortDoctype: true,
removeComments: true
})
}
We’re using the options here provided by the html-minifier package we installed. Of course your needs may differ so customize for your requirements.
Next we need to update Web’s configiration file (for example config/config.development.json) to load the new processor for every request:
"globalPostProcessors": [
"minify-html"
]
And that’s it! You should now see minified HTML sent to your browser.
If you need to disable (or enable) on a page-by-page basis you can customize the options in your page.json files:
To disable all global post processors:
{
"settings": {
"postProcessors": false
}
}
To enable only a specific one:
{
"settings": {
"postProcessors": ["remove-swear-words"]
}
}
🔗Conclusion
You can read more of the technical details in the pull request for this feature.
We will be talking more about Web 5.0 in the coming weeks so please stay tuned or let us know if there are any features you would like to see. And of course, we’ll let you know when it’s released via Twitter.
