[Solved] Minify HTML with EJS

[marceloboeira]

Why this doest work?

var minify = require('html-minifier').minify;
var ejs = require('ejs');
var parsing = function(path,options,fn) {
    ejs.renderFile(path, options, function(err, str){
      str = minify(str,{collapseWhitespace: true});
      return fn(err, str);
    });

};

module.exports.views = {
  engine: {
    ext: 'ejs',
    fn: parsing
  },
  layout: 'layout/default'
};

[sgress454]

This forum is for reporting bugs in the Sails core; support questions should go in the Google Group or StackOverflow (where you've already posted this).

[marceloboeira]

Alright 👍

[marceloboeira]

@sgress454 the StackOverflow thread is closed, and I still have no answer. 👎

[sahanDissanayake]

@sgress454 Would be really nice to know how to do this.

As

https://groups.google.com/forum/#!topic/sailsjs/zSxv7uJEVrM
http://stackoverflow.com/questions/26051280/minify-all-of-sailsjs-served-html

There is no answer right now.

Thank you.

[marceloboeira]

+1

[sgress454]

@marceloboeira unfortunately I couldn't get that SO question re-opened, where I had basically answered you in the comments. The problem is that when you declare a default layout with EJS, Sails overrides your view configuration in order to use ejs-locals to incorporate layout support that was stripped out of Express. So you can set layout: false, and your code will work...almost. It won't have any layout, which is probably not what you want. Instead, you can use ejs-locals yourself:

var minify = require('html-minifier').minify;
var ejs = require('ejs-locals');
var parsing = function(path,options,fn) {
    options.locals = options.locals || {};
    options.locals._layoutFile = 'layout.ejs';
    ejs(path, options, function(err, str){
      str = minify(str,{collapseWhitespace: true, removeComments: true});
      return fn(err, str);
    });

};

module.exports.views = {
  engine: {
    ext: 'ejs',
    fn: parsing
  },
  layout: false
};

should do the trick.

[marceloboeira]

@sgress454 thanks! It worked!

Only this line is different:

 options.locals._layoutFile = '/layout.ejs';

[sgress454]

@marceloboeira Works both ways for me. In any case why don't you go ahead and post this as an answer on the new StackOverflow question!

[marceloboeira]

@sgress454 alright!

[mewben]

👍 It worked... This would be super useful if enabled by default in production...

[sahanDissanayake]

Keep an eye out for the time it takes when everytime the page is requested and the time you receive the file

For me normal file was sent in 179ms and when minify was enabled it took up to 900ms

So there is a problem here.

[mewben]

@sahanDissanayake How do you test the time? Newbie here...

[sahanDissanayake]

@mewben If you are using Google Chrome use https://chrome.google.com/webstore/detail/postman-rest-client/fdmmgilgnpjigdojojpjoooidkmcomcm?hl=en

And then you can just enter the link and then you will see the results. Let me know

[mewben]

Seems ok to me... I'm using a fresh sails install in my local dev...

[mewben]

I mean no noticeable difference at all... without minification, I got 75ms... With minification, i got 65ms. on homepage...

[iswanj]

how can we use it for multiple layouts ?

[marceloboeira]

@iswanj tricky question, ...

[marceloboeira]

@mewben I should test several times the same page, I didn't have the time to test it yet.

[iswanj]

@marceloboeira I already solved that

var minify = require('html-minifier').minify;
var ejs = require('ejs-locals');
var parsing = function(path, options, fn) {
  options.locals = options.locals || {};

  // use default 'layout.ejs' if res.locals.layout is not set
  options.locals._layoutFile = '../' + options.layout;
  ejs(path, options, function(err, str) {
    str = minify(str, {collapseWhitespace: true, removeComments: true});
    return fn(err, str);
  });
};

module.exports.views = {
  engine: {
    ext: 'ejs',
    fn: parsing
  },
  layout: false

};

[marceloboeira]

👍