Possibility to disable all (or part of) transformers

[schirliuradu]

• Maizzle Version: 3.0.0
• Node.js Version: 14.15.1

Hi Cosmin,

While trying to use maizzle directly in nodejs, i noticed that building time is not really optimal when you have very big / long html templates.

I tried to inspect a bit which are the parts that take more time in building process and saw that a big portion of those 5 / 6 seconds of building are taken by transformers. Well, i know that all of them are very useful in many situations, and it's absolutely correct to have them all active by default. However, if i want to disable them, or at least part of them, i can not.

Some of them have the possibility to be disabled (ex: inliner), but not all of them. With a big template i noticed that a big part (in my case, 2 of those 6 seconds were taken by applyExtraAttributes). ApplyExtraAttributes is very important and applies by default properties that i need too to table elements, but it takes a lot of time to do it. I could just put those important elements directly in html on table elements, and doing so i could save few seconds from those 5 / 6. But, there's no possibility / option to disable it completely.

I think, as i already said above, that it's correct to have all of them active by default, but it would be very nice to have the possibility to disable all of them, or at least part of them.

There is access to config object inside all transformers, and it would be enough to do, and read some variables like maizzle already does with inlineCss to disable all/part of them:

  inlineCSS: {
    enabled: true,
    applyWidthAttributes: ['TABLE', 'TD', 'TH']
  }

[cossssmin]

Wow if 5/6 seconds is for a single template, then that's huge and doesn't sound right, I'd be happy to have a look if you can share a repo. Tip: if your compiled HTML is >102KB, it gets clipped in Gmail (see discussion).

So anyway, most Transformers won't do anything by default since they're optin, but indeed applyExtraAttributes is used even if you don't opt in, and it adds these:

https://github.com/maizzle/framework/blob/54b47be1164efcbfebf9c68978d5a62aa71eded5/src/transformers/extra-attributes.js#L8-L17

I completely agree, you should be able to at least opt-out/disable transformers that normally always run.

I'll have a look at it these days, there are a few more that always run too (safeClassNames, sixHex).

Thanks for bringing it up, just in time for v3.1, too 👌

[schirliuradu]

Yep. I just checked my compiled template size and yes, my full template, about which i was talking (big / long template) has 122kb. By the way, i am testing all the components that i made in just one single template, but i will never have them all together. So i won't have templates bigger than 100 kb, i think.

If i consider only parts / components that i need i have emails that have around 60 - 90 kb. And i think i could save some time even there, at least one / one and a half second would be a lot for me.

We could just disable all of them with just one unique variable in config file. For example something like this:

  if (options && typeof options.applyTransformers === 'boolean' && options.applyTransformers) {
    html = await Transformers.process(html, config)
  }

Could be useful something like this (or something that just does this somehow), because i can disable all of them with just one config variable. By the way, as i am using maizzle in nodejs, i have access to all those transformers that are anyway exported, and i can apply just the one i need after build process, and i need just 2 / 3 of them.

Alternative is to just add variable to every transformer and set it to true by default, as already provided for inlineCss, but having at same time possibility to disconnect each of them individually.

Let me know and thank you again.

[cossssmin]

I think we could do both global and per-transformer disabling 👍

[schirliuradu]

Well, that would be amazing. Thank's 👍