clean-css VS UglifyJS2

Minification involves removing unnecessary characters, whitespace, and comments from code files. It helps reduce HTML, CSS, JavaScript, etc., file sizes without compromising functionality. Removing redundant elements makes these HTML, JavaScript, and CSS files smaller. Since smaller code files need less internet traffic to transfer, they load faster. Utilizing tools like UglifyJS, Clean-CSS, and HTMLMinifier enhances this process of code reduction. They analyze the code, remove redundant code, and generate optimized files for deployment.

By setting minifyCSS and minifyJS to true, the CSS will be minified together using clean-css and the JS will be minified together using UglifyJS to minify the JS together. Also, the other side of gatsby-plugin-minify is just multiplying html-minifier by postbuild in gatsby-node.js. You can set detailed options in html-minifier.

Depending on whether set to true or false (or not included as the default value is false), the last two options, --minify-js and --minify-css will minify the corresponding source of their type, only if included as inline style or script tags in the html being minified. It may also be good to know that the html-minifier options information states that clean-css and uglify-js are used for the minification when these options are included.

Minification involves removing unnecessary characters, whitespace, and comments from code files. It helps reduce HTML, CSS, JavaScript, etc., file sizes without compromising functionality. Removing redundant elements makes these HTML, JavaScript, and CSS files smaller. Since smaller code files need less internet traffic to transfer, they load faster. Utilizing tools like UglifyJS, Clean-CSS, and HTMLMinifier enhances this process of code reduction. They analyze the code, remove redundant code, and generate optimized files for deployment.

Example: You've got a main.js file that's as long as a Tolstoy novel. Fix: Use tools like UglifyJS or Terser to minify your code. They'll squeeze out all the unnecessary bits and give you a sleeker, faster-loading file.

Minification: UglifyJS, Terser

There are a bunch of libraries that do this, but my current go to is Uglify: https://www.npmjs.com/package/uglify-js

There are many minifiers such as terser and uglify. But, because minifying also require to parse the JS, it is actually possible to use esbuild and SWC to minify the code. Here's a benchmark of the main minifiers.

In my understanding, UglifyJS 3 is the most popular JavaScript minifier tool presently -- it has a very high weekly download too. And as per the official documentation, it supports ES6.

I'm thinking reverse-engineered uglified js code (https://github.com/mishoo/UglifyJS) is not as impenetrable as code from reversed engineered wasm binaries? The element of plausible deniability is much more potent though, for the nefarious actor on the other side.

Program: uglifyjs Arguments: $FileName$ -c -m -o $FileNameWithoutExtension$.min.js

Apart from terser, you can also use uglify-js to compress or minify javascript.

Uglify