1

If i include javascript in a template using:

{% set myJS %}
//some JS in here
{% endset %}

{% includeJS myJS %}

Is there a way to minify the javascript that gets output on the page? I had a look at the documentation but couldn't find anything. The only way i have found to do it otherwise is to put the javascript in an external file, minify that, and include it with {% includeJsFile %}. Any ideas on how i could do this? Or is there a better way to achieve the same result?

4

I don't believe there is a way to minify javascript when it is output to the page. If there is it would make for increased load time. My suggestion is to use a preprocessor like Gulpjs or Gruntjs.

The basic workflow is when you update your JS file/s the preprocessor can detect the change and concatenate and minify your files into a production file.

You will need to install Node. An easy way to do that is to use Homebrew.

brew install node

I am including links to a couple files to help you start. One is the package.json file that NPM uses to install the node components. The other gulpfile.js is a starter file for using Gulpjs, to give you an idea of how to setup the tasks.

2
  • I concur that it's usually better to concat/minify locally, but if you want to do it serverside/in your templates there's the AutoMin plugin. Note that AutoMin will cache any minified file(s), so the load time footprint on subsequent visits will be minimal. Nov 4 '15 at 11:41
  • Thanks for the links and suggestions - sounds like external file is the way to go for me, although the automin plugin looks interesting. i've tinkered with grunt in the past but i've been meaning to get more involved with it.
    – alexr
    Nov 6 '15 at 15:21

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.