JSFiddle - React, Tailwind, and code Playground

by Ravindra Athreya

JavaScript

function ProcessArray(data, handler, callback) {
  var maxtime = 100;		// chunk processing time
  var delay = 20;		// delay between processes
  var queue = data.concat();	// clone original array

   setTimeout(function() {

    var endtime = +new Date() + maxtime;

    do {
      handler(queue.shift());
    } while (queue.length > 0 && endtime > +new Date());

    if (queue.length > 0) {
      setTimeout(arguments.callee, delay);
    }
    else {
      if (callback) callback();
    }

  }, delay);
}
// end of ProcessArray function

// process an individual data item
function Process(dataitem) {
  document.write(dataitem);
}

// processing is complete
function Done() {
  document.write("Done");
}

// test data
var data = [];
for (var i = 0; i < 500; i++) data[i] = i;

// process all items
ProcessArray(data, Process, Done);