dbuezas commented 3 years ago

In the es-build documentation there is an option to use the ESBuildMinifyPlugin for CSS minification here.

This module doesn't seem to take advantage of that.

Thanks for the convenience of this anyway! :)

pradel commented 3 years ago

Oh yeah, I didn't know this was possible, pull request welcome to add it :)

dbuezas commented 3 years ago

Oh, i was afraid you would say that 😅

It works!

I got it to work locally by:

removing the OptimizeCssAssetsWebpackPlugin from the optimisers,
passing css:true to the esbuild minifyer

Results

TL;DR: css optimisation takes place and takes virtually no time

Before

After

Proof

Css minification was taking 1.24 sec in a small-ish project, now it takes pretty much nothing (~0.033s). Just to make sure this is actually working I tried passing css: false to the optimiser and the css output was indeed way bigger

Size delta between css: true and css: false

Slight improvement

I see you replace terser with esbuild by swapping the first element of the minimizer array. I'd like to change that so it picks it by name. Is that ok for you if I also do that in the PR?

API Caveat

There's a slight API problem. the Options of the compiler are slightly different to that of the minifier and you use the same parameter to configure both.

I see two options:

Add a second minimizerOptions parameter
Allow css:true in the existing options but clean it up before passing to the compiler.

I think that option (1) is the cleanest. What do you think?

Questions

Ok if I switch minimizer replacement to do it by name instead of index?
Ok if I add a second minimizerOptions parameter?
Should the default behaviour replace the CSS optimiser or not?

~~The PR will come after your feedback 🙏~~ Well....