pyramid_html_minifier
pyramid_html_minifier
introduces safe html minification
with no overhead for Pylons/Pyramid
applications powered by:
-
Chameleon
templates (ZPT
based template implementation).Chameleon
templates are still validXML
, so they can be safely minified with not too aggressive minification options
What you get with pyramid_html_minifier
-
bandwith and performance. Save precious kilobytes (~50-80% depending on your templates).
It is quite important for bandwith usage and improved performance,
even more important if you have to manage a big and fat
Pylons/Pyramid
based website with a lot of traffic. See https://www.npmjs.com/package/html-minifier - no overhead. The minification is based on a build step (a sort of gulp/grunt based collectstatic). So no minification on the fly
-
safe template/html minification. It works even with
macros
andslots
. This pattern has been adopted on production websites with no issues after 1 year. So I dare say it is a safe pattern after a 1-year quarantine without any sort of problems. You should only remember to disable too aggressive minification options (see next sections)
What pyramid_html_minifier does
What pyramid_html_minifier
introduces:
- a custom
.html
renderer (interpreted asChameleon
templates) - support for
dist
vsapp
, commonly used inYeoman
projects.app
will be used for development, whiledist
in production mode (based on a template minification build).
This way you can start developing static mock applications (even
heavily Javascript based) using the Yeoman
workflow and use your
modified html files enriched by macros and slots as Chameleon
templates.
How to use pyramid_html_minifier
Here you can see how to enable Chameleon templates minification in your
Pylons/Pyramid
web application:
- put your
Chameleon
template file intemplates/app/master.html
and its minified version intemplates/dist/master.html
(the.html
extension is important). Obviously don't do minification by hand, addYeoman
in your development workflow with its related tools for automation. This package does not provide anygulp
orgrunt
configuration, you are supposed to create your own setup - register a normal
Pylons/Pyramid
callable view withrenderer="your_plugin:templates/{0}/master.html"
. The{0}
is only a placeholder thatpyramid_html_minifier
will fill depending on your settings. See next step - tell
pyramid_html_minifier
if you want to pick up standard templates or minified ones adding thepyramid_html_minifier.placeholder
setting to your.ini
file. Typical value for development isapp
(the default one), whiledist
is usually used for prodcution environments. Example:pyramid_html_minifier.placeholder = dist
- add
pyramid_html_minifier
to your pyramid.includes setting
The final .ini file should looks like the following one:
pyramid.includes = ... pyramid_html_minifier ... pyramid_html_minifier.placeholder = dist
Safe minification options
I suggest to automate the build process integrating the Yeoman
workflow into your
Pylons/Pyramid
project for the best developing experience.
I suggest to use the html-minifier
minificator and its friend gulp-html-minifier
disabling too aggressive html minification options.
In particular be sure that the keepClosingSlash
option is enabled and
removeAttributeQuotes
is disabled.
Here you can see a real example working configuration:
const htmlMinifierOptions = { collapseBooleanAttributes: true, collapseWhitespace: true, removeComments: true, removeCommentsFromCDATA: true, removeEmptyAttributes: true, removeRedundantAttributes: true, useShortDoctype: true, keepClosingSlash: true, } ... gulp.task('html', ['styles'], () => { const assets = $.useref.assets({searchPath: ['.tmp', 'app', '.']}); return gulp.src('app/*.html') .. .pipe($.if('*.html', $.htmlMinifier(htmlMinifierOptions))) ... .pipe(gulp.dest('dist'));
Why Yeoman
Why Yeoman
:
- better and more modern web development experience
- minification and/or resources concatenation (images, css, Javascript)
- more. See http://yeoman.io/
Links
More details about case studies using the same pattern:
- http://davidemoro.blogspot.it/2014/09/plone-angularjs-yeoman-starter.html
- http://davidemoro.blogspot.com/2014/09/pyramid-starter-seed-yeomam-part-1.html
- http://davidemoro.blogspot.it/2013/08/yeoman-express-and-angularjs.html
Authors
- Davide Moro (https://twitter.com/davidemoro)