Enter your JS code to compress:
Add up to 10 multiple JS files (Size Limit: 2MB per file)
Minifying, or minification, is where you do away with pointless characters out of your code, whether or not they might be whitespace (along with indentation), code that isn't ever used, feedback on your code or long names for variables that may be replaced with something shorter.
Minification of your code outcomes in it taking over less space, making it quicker to send from a server to a purchaser, in addition to the usage of less bandwidth in doing so. This improves the user revel in for your web page as it is able to load quicker.
You need to simplest minify the code that you are distributing though, now not your source version that you are writing, as minified code is tougher to read and understand, making debugging extra complicated. Offering a supply map facilitates with this, as it maps the minified code returned to the original source code, allowing manufacturing mistakes to be mapped to the perfect bit of code inside the supply version.
The use of terser in a production pipeline
There are many different options to be had for minifying your code in a production workflow, which includes uglify-js or minify, but terser appears to be the most popular device presently available, as it may handle both es5 & es6 syntax out of the container.
Terser is available on npm and can be set up on your challenge with npm deploy terser. Optionally, you could install it globally to your device by adding the -g flag to the command, allowing the cli for use anywhere and the module to be blanketed in any challenge.
As soon as hooked up, there are two essential ways to interact with terser. Either, you could use the command line interface (cli) thru your terminal/console, or you can use the terser javascript API which permits more quality manipulation over how your code is minified.
To minify a report with terser through the cli, you can run terser my_code.Js --output my_file.Min.Js. Compression and mangling can be enabled with the --compress and --mangle flags respectively. Sourcemap era also can be enabled with the --source-map flag. An instance of a way to minify your code the use of the terser javascript API is included beneath.
What can we do with JS Minifier?
More about JavaScript: