Dead-code elimination: Hint uglify-js that your function is pure
Imagine you have the code below:
after passing this code through uglify-js, you will get the code below:
uglify-js will do dead code removal, ie: it will remove code that will not affect the program results. Since we defined
b in the function
foo and we are not using
b within the
foo, uglify-js safely removes it from the uglified code.
However, if you can see from the uglified code,
foobar() is preserved. This is because calling
foobar may have side effects on the program, so uglify-js preserves
foobar(). But since we do not need the return value of
foobar(), which is assigned to
a got removed by uglify-js.
What if we know that
foobar() will not caused any side effects?
How do we tell uglify-js that if we are not using the return value from
foobar(), please remove it as well?
uglify-js will treat a function call as “pure” if there is a comment annotation
/*#__PURE__*/ immediately precedes the call.
/* @__PURE__ */ foobar() !
Note that now
foobar() is being removed!
So, how is this useful?
As a library author, you can write a babel plugin to mark your function to be pure, so that uglify-js can drop the function call if the return value is not being used in the code. (There is a util from babel to do just the job of marking function as pure 😎)