Why is Minified Code not Equivalent to Original?

Question

When I ran my MVC 4 project in Release mode, one page that uses SlickGrid did not display correctly (the grid is very, very tall and the grid cells are missing).

However, I do not think this is an issue of SlickGrid, but rather of how the bundler (System.Web.Optimization that is integrated into MVC 4) minified the code.

I grabbed the minified JavaScript and began reversing minification in one area at a time until the problem was fixed. I found that changing (and forgive the scrolling, I want to leave the minified version exactly as-is)

function SlickFilter(n,t){var i=n.option,r=t.searchString;return n.pctSortKey.key<t.percentCompleteThreshold||r!=""&&i.indexOf(r)==-1&&i!="Unweighted Response"&&i!="Median"&&i!="Average"?!1:!0}

to the original

function SlickFilter(item, args) {
    if (item.pctSortKey.key < args.percentCompleteThreshold) {
        return false;
    }

    if (args.searchString != "" && item.option.indexOf(args.searchString) == -1 && item.option != "Unweighted Response" && item.option != "Median" && item.option != "Average") {
        return false;
    }

    return true;
}

resolves the issue if all other elements of the minified file are unchanged.

The function is used like:

dataView.setFilter(SlickFilter);

to provide a callback function for SlickGrid to filter out certain results.

How is it that the original and the minified function are not equivalent?

UPDATE

SlickGrid is "compiling" the filter function that I provide. That compilation step is failing with the minified version. The compiled minified code looks like:

function anonymous(_items,_args) {
var _retval = [], _idx = 0; var n,  t = _args; _coreloop: for (var _i = 0, _il = _items.length; _i < _il; _i++) { n = _items[_i]; 
    //debugger;
    var i = n.option,
        r = t.searchString;

    return 
    n.pctSortKey.key < t.percentCompleteThreshold 
    || 
    r !="" 
        && i.indexOf(r)==-1 
        && i != "Unweighted Response" 
        && i != "Median"
        && i != "Average"
? !1
: !0
; } return _retval; 
}

Note the multiple return statements.

With this additional insight, I was able to identify a relevant SlickGrid bug:

https://github.com/mleibman/SlickGrid/issues/301

Answer 1

The one difference I see is that item.option and args.searchString are being evaluated even when the first condition is true when they would not have been in the original code.

Have you tried stepping into the code to see what the values are and how it acts on them?

Here is the unmangled minified code to save anyone else doing the same, or if you wish to try it and step into it.

function SlickFilter(n,t) {
var i = n.option,
    r = t.searchString;

return 
        n.pctSortKey.key < t.percentCompleteThreshold 
        || 
        r !="" 
            && i.indexOf(r)==-1 
            && i != "Unweighted Response" 
            && i != "Median"
            && i != "Average"
    ? !1
    : !0
}

EDIT (by OP)

This got me on the right path, but it turns out that SlickGrid is "compiling" the filter function. There's a known issue that the compiler sometimes fails. Indeed compiling is optional and not necessary in this case since the minifier already produces optimized code.

https://github.com/mleibman/SlickGrid/issues/301