Why do minfiers reduce to one line

Question

This question is similar to: Why do we have newlines in minified JavaScript?

In this case, I would prefer half a dozen or so newlines. Why do minifiers reduce code and style to one line? Even on production code, I might have bugs that I didn't consider. While, other may be professional-100% perfect developers, I'd like an option to at least insert a dozen or so newlines. I have avoided minifying code for a bit. Until now, I'd like a bit more performance but some balance of code review as well.

Maybe not a newline for every function, but at least for every class object since I use a lot of custom React Component classes.

Pretty:

var num = 10;
const dothis = function() {
 let x = 0;
 for(x = 0; x < num; x++) {
    ...
};
function dothat(){
  var foo = 'Hello';
  let name = 'World';
  var bar = foo + name;
  console.log(bar);
}

Uglified

var num=10;const dothis=function(){let x=0;for(x=0;x<num;x++){...}};function dothat(){var foo = 'Hello';let name = 'World';var bar = foo + name;console.log(bar);}

Something in between

var num = 10;
const dothis = function() { let x=0; for(x = 0; x < num; x++) {...};
function dothat(){ var foo = 'Hello'; let name = 'World'; var bar = foo + name; console.log(bar); }

Having half a dozen or so newline would allow me to narrow down the function or class causing the problem. I understand this shouldn't replace testing during development.

Answer 1

Use the pretty-print option in devtools.

This will give you:

Documentation is here .