Testing time and space consumption of allocating JSON and DOM nodes - with 2 properties each

testSpeed.txt

Program: 

"use strict";

const testDOMSpeed = function (its) {
    const array = [];
    for (let i = 0; i < its; ++i) {
        const element = document.createElement("div");
        element.setAttribute("t1", "" + i);
        element.setAttribute("t2", "" + i);
        array.push(element);
    }
    return array;
};

const testJSONSpeed = function (its) {
    const array = [];
    for (let i = 0; i < its; ++i) {
        const element = {};
        element.t1 = "" + i;
        element.t2 = "" + i;
        array.push(element);
    }
    return array;
};

const clone = function (toclone) {
    const togo = {};
    for (let key in toclone) {
        togo[key] = toclone[key];
    }
    return togo;
};

const timeIt = function (its, fn, name) {
    const now = Date.now();
    const oldShot = clone(performance.memory);
    const value = fn(its);
    const delay = Date.now() - now;
    const newShot = performance.memory;
    const bytes = newShot.usedJSHeapSize - oldShot.usedJSHeapSize;
    console.log("Testing allocation of " + name);
    console.log(its + " iterations in " + delay + " ms: " + 1000 * (delay / its) + " us/it");
    console.log("Used heap size " + bytes + ": " + (bytes / its) + " bytes per object");
    console.log("Oldshot" , oldShot);
    console.log("Newshot", newShot);
    return value;
};

function testSpeed() {
    timeIt(1000000, testDOMSpeed, "DOM nodes");
    timeIt(10000000, testJSONSpeed, "JSON objects");
}

document.getElementById("run-tests").addEventListener("click", testSpeed);


Results:

Testing allocation of DOM nodes
testspeed.js:41 1000000 iterations in 2139 ms: 2.139 us/it
testspeed.js:42 Used heap size 38656208: 38.656208 bytes per object
testspeed.js:40 Testing allocation of JSON objects
testspeed.js:41 10000000 iterations in 3536 ms: 0.35359999999999997 us/it
testspeed.js:42 Used heap size 563876719: 56.3876719 bytes per object

testspeed.js:40 Testing allocation of DOM nodes
testspeed.js:41 1000000 iterations in 2173 ms: 2.173 us/it
testspeed.js:42 Used heap size 41460556: 41.460556 bytes per object
testspeed.js:40 Testing allocation of JSON objects
testspeed.js:41 10000000 iterations in 4072 ms: 0.40719999999999995 us/it
testspeed.js:42 Used heap size 497907604: 49.7907604 bytes per object

testspeed.js:40 Testing allocation of DOM nodes
testspeed.js:41 1000000 iterations in 2091 ms: 2.091 us/it
testspeed.js:42 Used heap size 38518904: 38.518904 bytes per object
testspeed.js:40 Testing allocation of JSON objects
testspeed.js:41 10000000 iterations in 3805 ms: 0.3805 us/it
testspeed.js:42 Used heap size 566912688: 56.6912688 bytes per object

testspeed.js:40 Testing allocation of DOM nodes
testspeed.js:41 1000000 iterations in 2127 ms: 2.127 us/it
testspeed.js:42 Used heap size 40346360: 40.34636 bytes per object
testspeed.js:40 Testing allocation of JSON objects
testspeed.js:41 10000000 iterations in 3515 ms: 0.3515 us/it
testspeed.js:42 Used heap size 582603968: 58.2603968 bytes per object