Sort Tests (increasing number)

trying to find that IE8 sweet-spot

by bladnman

HTML

<script src="https://raw.github.com/carhartl/jquery-cookie/master/jquery.cookie.js"></script>
<script src="http://www.bladnman.com/js/mbmJSUtilities.js"></script>
<script src="http://www.bladnman.com/js/MMStopWatch.js"></script>
<script src="http://www.bladnman.com/js/MMPhraseGenerator.js"></script>
<input type=button id="theButton" value="run test" class="runButton">
<input type=button value="clear log" onClick="clearLog()" class="runButton">
<input type=button id="showArray" value="Show Array" class="runButton">
<br>
<div class="options">
Run a specific test:
    <br>
<a href="#" onclick="runSpecificTest(1000)">1,000</a>
| <a href="#" onclick="runSpecificTest(2000)">2,000</a>
| <a href="#" onclick="runSpecificTest(4000)">4,000</a>
| <a href="#" onclick="runSpecificTest(6000)">6,000</a>
| <a href="#" onclick="runSpecificTest(8000)">8,000</a>
| <a href="#" onclick="runSpecificTest(10000)">10,000</a>
| <a href="#" onclick="runSpecificTest(12000)">12,000</a>
| <a href="#" onclick="runSpecificTest(15000)">15,000</a>
<br>
<a href="#" onclick="runSpecificTest(18000)">18,000</a>
| <a href="#" onclick="runSpecificTest(20000)">20,000</a>
| <a href="#" onclick="runSpecificTest(25000)">25,000</a>
| <a href="#" onclick="runSpecificTest(50000)">50,000</a>
| <a href="#" onclick="runSpecificTest(75000)">75,000</a>
| <a href="#" onclick="runSpecificTest(100000)">100,000</a>
<br>
<a href="#" onclick="runSpecificTest(200000)">200,000</a>
| <a href="#" onclick="runSpecificTest(300000)">300,000</a>
| <a href="#" onclick="runSpecificTest(400000)">400,000</a>
| <a href="#" onclick="runSpecificTest(500000)">500,000</a>
| <a href="#" onclick="runSpecificTest(1000000)">1,000,000</a>
</div>
<div id="log" class="log"></div>

CSS

body {
    font-family: arial;    
}
.runButton {
    width:   125px;
    margin:  20px;
}
.log {
   padding:10px; 
    margin: 20px; 
    border: 1px dotted #ccc; 
    color:#888; 
    font-size:14px; 
    background: #fbfbfb; 
}
.options {
    padding: 20px;
}

JavaScript

/* ************************************ */

var _countToTest = 0;
var stringLengths = 10;
var items = new Array();
var isRunning = false;
var step = 0;
var stepsToTake = 10;
var stepSize = 500;

function runSpecificTest(countToTest) {
    
    if (isRunning) return;
    
    
    
    step = 0;
    _countToTest = (countToTest - stepSize);
    stepsToTake = 1;
    
    takeAStep();
}
function runTest() {
    if (isRunning) return;
    step = 0;
    _countToTest = 0;
    stepsToTake = 10;
    takeAStep();
}
function takeAStep() {
    step++;

    ddebug(" ");
    
    if (step > stepsToTake) {
     //   ddebug();
       // ddebug("Done stepping");
        isRunning = false;
        return;
    }
    
    isRunning = true;
    
    
    _countToTest += stepSize;
    
    

    populateArrayWithNames(_countToTest);
    
    ddebug("["+_countToTest+"] items");

    setTimeout(sortByString, 10); // give time back
}
function populateArrayWithNames(count) {
         
    items.length = 0;
    
    for (var x = 0; x < count; x++) {
        var item = {};
        item.value = MMPhraseGenerator.name();
        items.push(item);
    }
    
//    ddebug("added: " + count + " items " + items.length);
}


function logArray() {
    items.describe();
}
Array.prototype.describe = function() {
    ddebug("describing array:");
    ddebug();
    for (var i = 0; i < Math.min(10, this.length); i++) {
        ddebug("[" + i + "] " + this[i].value);
    }
    ddebug();
}
function sortByString() {    
    MMStopWatch.start("Sort standard");
    var ascending = true;
    items.sort(sort_string_by("value", ascending, true));
    MMStopWatch.stop("Sort standard");
    ddebug( "---> runtime " + MMStopWatch.runtime("Sort standard") );
    
    setTimeout(takeAStep, 10); // give time back
}
    function sort_string_by(field, isAscending, isCaseInsensitive) {
        return function (a, b) {
            var aValue        = getStringValue( a[field] );
            var bValue        =...