Advanced Static Types in TypeScript

This course explores the capabilities of TypeScript’s type system and shows how to use advanced static types in practice.

Watch the Course

Detecting Minified JavaScript Code

I recently found out a neat little trick to detect whether the currently executing piece of JavaScript code has been run through a minifier. Now, I'm not too sure whether there's a reasonable use case for this approach, but I find it interesting nonetheless, so here we go.

Minifying JavaScript Code

When JavaScript code is minified using a preprocessor like UglifyJS, a lot of characteristic changes are made to shorten the resulting code as much as possible to minimize the size of the resulting script. Here are the most notable shortenings:

  • Insignificant whitespace will be removed.
  • Comments will be stripped. (Non-license comments, anyway.)
  • Names of local variables, local functions, and parameters will be shortened.

We'll use that knowledge to detect whether a piece of JavaScript code has been minified, but first we need to look at regular expressions and the test function in particular.

Matching Strings Against Patterns

To find out whether a string matches a specified regex pattern using JavaScript, we can call the test method on a regular expression object:

var endsInScriptPattern = /Script$/;

endsInScriptPattern.test("JavaScript");    // true
endsInScriptPattern.test("CoffeeScript");  // true
endsInScriptPattern.test("Dart");          // false

The test method will convert its argument to a string if it doesn't already have type String. This means we can pass arguments of other types as well:

var digitsOnlyPattern = /\d+/;

digitsOnlyPattern.test("123");  // true
digitsOnlyPattern.test(45678);  // true
digitsOnlyPattern.test("abc");  // false

Detecting Minified JavaScript Code

Let's now combine the aforementioned observations to detect an environment in which the executing JavaScript code has been minified:

var isUnminified = /param/.test(function(param) {});

That's it. Simple and elegant. Now, how does this line of code work?

During the minification process, the minifier sees a function with a single parameter named param and either shortens that name to p (or some other letter) or removes the parameter altogether since it's not being used within the body of the function. The chosen approach depends on how the minifier has been configured.

At runtime, the test method will convert its argument, the dummy function, to a string. That results in "function(p){}" or "function(){}", respectively. Neither of those contain the string param, so the test method returns false and that value is then assigned to isUnminified.

You could also determine whether the JavaScript code has been minified by looking for comments. If a comment can be found, the code most likely hasn't been minified:

var isUnminified = /comment/.test(function() { /* comment */ });

Again, all of this depends on how the minifier has been configured. Your mileage may vary, you've been warned. And now, happy coding!

Learn Node