JSFiddle - React, Tailwind, and code Playground

JavaScript

var container = document.body;
for (var i = 0; i < 1000; i++) {
    var e = document.createElement('div');
    container.appendChild(e);
    e.textContent = i;
}

function reverse(container) {
    var length = container.childNodes.length;
    var child = container.firstChild;
    var prevChild = null;
    var nextChild;
    for (var i = 0; i < length; i++) {
        nextChild = child.nextSibling;
        container.insertBefore(child, prevChild);
        prevChild = child;
        child = nextChild;
    }
}

var j, t;
var samples = [];

var simpleResult, rafResult;

function update() {
    t = window.performance.now();
    reverse(container);
    samples.push(window.performance.now() - t);
}

function finish() {
    document.body.innerHTML = "<div>Simple: " + simpleResult + "</div><div>Raf: " + rafResult + "</div>";
}

// Simple update
for (j = 0; j < 100; j++) {
    update();
}

simpleResult = samples.reduce(function(a, b) { return a + b; }, 0) / samples.length;

// Raf update
samples = [];
j = 0;

function asyncUpdate() {
    update();
    if (j < 100) {
      j++;
      requestAnimationFrame(asyncUpdate);
    } else {
      rafResult = samples.reduce(function(a, b) { return a + b; }, 0) / samples.length;
      finish();
    }
}

requestAnimationFrame(asyncUpdate);