Javascript minify or obfuscate code before browser loads JS

Question

I need a solution to obfuscate or minify my javascript code before the client loads any of my important javascript files. I need my code to have all the comments for future development, but load a minified or obfuscated version to my users.

The reason I want to do this is because my code is heavily commented. I need my comments for future updates, but I don't want prying eyes reading my comments as that's asking for trouble. Thanks!

you mean in runtime ? why don't you minify the files before deployment. — Shivaji Varma, May 18 '18 at 06:27
The usual practice is to keep a plain version of your code for development, and also create a minified version that will be served to the browser. Gulp will help you with that. — Jeremy Thille, May 18 '18 at 07:13
Possible duplicate of [How can I obfuscate (protect) JavaScript?](https://stackoverflow.com/questions/194397/how-can-i-obfuscate-protect-javascript) — Jeremy Thille, May 18 '18 at 07:15

Catalin MUNTEANU · Accepted Answer · 2018-05-18T07:02:51.220

1

I recommend Grunt for minification and concatenation of JS files (and other types).

Complete details on how to integrate minification using grunt-contrib-uglify.

If you also desire to concatenate your files and deliver one single file, check grunt-contrib-concat.

To speed up the development you should also use grunt-contrib-watch that allows you to watch over changes to your files and run the defined tasks.

Basic setup for minification:

grunt.initConfig({
    uglify: {
        my_target: {
            files: {
                'dest/output.min.js': ['src/input1.js', 'src/input2.js']
            }
        }
    }
});

Also check out the sample Grunt-file in which you should define all your tasks.

edited May 18 '18 at 07:02

answered May 18 '18 at 06:20

Catalin MUNTEANU

5,618
2
35
43

Thanks Catalin! I'm going to go over the documentation now. Does grunt automatically update the output file each time I add additions to my code? – Logical Nonsense May 18 '18 at 06:47
@LogicalNonsense, yes. You can use grunt-contrib-watch. I updated my answer. – Catalin MUNTEANU May 18 '18 at 07:03
Grunt is hairy. Look at Gulp, much easier to configure and use. – Jeremy Thille May 18 '18 at 07:13
Thanks Jeremy, I'll also look into gulp. – Logical Nonsense May 18 '18 at 07:22

Javascript minify or obfuscate code before browser loads JS

1 Answers1