JSFiddle - React, Tailwind, and code Playground

by Michael Perrenoud

HTML

<div id="console"></div>

JavaScript

var max = 100000;
var avgMax = 100;

function timer() {
    var _begin, _end;
    
    this.start = function() {
        _begin = performance.now();
    }
    
    this.end = function() {
        _end = performance.now();
    }
    
    this.elapsed = function() {
        return Math.floor(_end - _begin);
    }
}

console.log = function() {
    var s = Array.prototype.join.call(arguments);
    $('#console').append('<p>' + s);
}

function timeUsingMod(nums) {
    var t1 = new timer();
    t1.start();

    for (var i = 0; i <= max; i++) {
        if (i % 4 === 0) {
            nums.push(i);
        }
    }

    t1.end();
    return t1.elapsed();
}

function timeUsingSlice(nums) {
    var t2 = new timer();
    t2.start();

    for (var i = 0; i <= max; i++) {
        var root = i % 100;

        var ones = root % 10;
        if ((ones % 2) !== 0) {
            continue;
        }

        var tens = (root - ones) / 10;
        var tensIsEven = (tens % 2) === 0;

        if (tensIsEven && (ones == 0 || ones == 4 || ones == 8)) {
            nums.push(i);
        } else if (!tensIsEven && (ones == 2 || ones == 6)) {
            nums.push(i);
        }
    }

    t2.end();
    return t2.elapsed();
}

var nums = [];
var elapsed = [];
for (var i = 0; i < avgMax; i++) {
    elapsed.push(timeUsingMod(nums));
}
var sum = elapsed.reduce(function(a, b) { return a + b; });
var avg = sum / elapsed.length;
console.log('t1: ' + avg);
console.log('nums: ' + nums.length);

nums = [];
elapsed = [];
for (i = 0; i < avgMax; i++) {
    elapsed.push(timeUsingSlice(nums));
}
sum = elapsed.reduce(function(a, b) { return a + b; });
avg = sum / elapsed.length;
console.log('t2: ' + avg);
console.log('nums: ' + nums.length);