This site uses cookies for analytics. By continuing to browse this site, you agree to this use.
A JS Foundation Project

JavaScript should be minified

JavaScript should be minified (minified-js)

This hint checks whether JavaScript used by your web page is minified or not.

Why is this important?

Minifying your JavaScript is a great way to improve your page load time. This includes removing unused variables and methods, renaming variables and methods to smaller names, removing code comments, etc. Minification should generate a smaller file, and thus less code to parse.

What does the hint check?

This hint generates an “Improvement Index” value for the script content and compares it against a derived threshold value to determine whether the content is minified or not.

Improvement index is generated by comparing the number of tokens (from the abstract syntax tree generated from the code) with the total content length of a file.

const tokenRatio = tokenLength / contentLength;
const improvementIndex = Math.round((1 - tokenRatio) * 100);

if (improvementIndex > threshold) {
// Script might be unminified
}

By default, the hint uses 75 as the threshold value to compare against. If the calculated improvement index value is greater than the threshold, the script will be flagged as unminified.

The value 75 was derived after running tests on some of the most used libraries and a couple of custom JavaScript files. See the sample repo with the test files and results.

Can the hint be configured?

By default, the hint uses 75 as the threshold value. But you can override that with a custom value in your .hintrc config:

{
"connector": {...},
"formatters": [...],
"parsers": ["javascript"],
"hints": {
"minified-js": ["error", {
"threshold": 80
}]
},
...
}

How to use this hint?

To use it you will have to install it via npm:

npm install @hint/hint-minified-js

Note: You can make npm install it as a devDependency using the --save-dev parameter, or to install it globally, you can use the -g parameter. For other options see npm's documentation.

And then activate it via the .hintrc configuration file:

{
"connector": {...},
"formatters": [...],
"hints": {
"minified-js": "error",
...
},
"parsers": ["javascript"],
...
}

Further Reading

Here are some useful topics if you are new to minification: