Rendering Speed Test

I'm pretty sure this has already been done a long time ago but I have always wondered about the time it would take to render content with JS to DOM. So today, I did a little test. Nothing fancy here, just some simple for..in loops and a render function that spits out data wrapped around some divs. Here are some JS snippet and the result at the end.

Render First

        var apps = obj.apps;
        console.time("Time this");
        for (key in apps) {
            appCount.innerHTML += render(apps[key]);
        }
        appDiv.innerHTML = div;
        appCount.innerHTML = obj.totalAppsCount;
        console.timeEnd("Time this");

Render at Completion

        console.time("Time this");
        var div = '' 
        for (key in apps) {
            div += render(apps[key]);
        }
        appDiv.innerHTML = div;
        appCount.innerHTML = obj.totalAppsCount;
        console.timeEnd("Time this");
        return;

Results?

Render first: 35.08ms
Render at completion: 1.68ms!

Eventhough, I was only testing this on a 50 item obj this is a pretty big gap, IMO of course.

Have a better way to speed up the time even more? Let me know!
Thanks for reading! Upvote and follow if you loved it!