Compiled and Minified Assets with Flask-Assets & Webassets


All these times coding in PHP, I have yet to experience an elegant way to compile and minify assets including but not limited to CoffeeScript, JavaScript and or CSS. Watchers for specific transcompiler were needed and it blocks me from coding straight up. Well Python and Flask specifically is giving me sweet dreams.

Have a look first at Flask-Assets and then dive in to Webassets. FYI, Flask-Assets if you set it up as your dependency will include Webassets also. I love Flask because it’s simple, to the point and very flexible to extend to your liking.

First of all, Webassets provides a number of transcompiled language support and also minification using filters. Here are some the filters that I’m using routinely:

  • rjsmin - The default JavaScript minifier, this brings the best performance from my experience.
  • cssmin - self explanatory
  • less - Less markups to CSS
  • coffeescript - A JavaScript transcompiler

Webassets is painless to set up and even easier to implement. The first thing you do is to set up a Bundle like so:

To put the compiled and minified assets into HTMLs, here’s a rough example of the HTML template:

So it’s trivially easier best of all, you don’t have to set up any watchers. Just run the app like any Flask app and it will watch for changes automagically. My best advice is to put the static directory on a memory drive like /dev/shm if you’re using Linux.

Take a look at Flask-Assets FAQ here and smile more everyday :D