JSFiddle - React, Tailwind, and code Playground

JavaScript

var resolveAfter2Seconds = function() {
	console.log('starting slow promise');
  return new Promise(resolve => {
  	setTimeout(function() {
    	resolve(20);
      console.log('slow promise is done');
    }, 2000)
  })
}

/* resolveAfter2Seconds(); */

var resolveAfter1Second = function() {
	console.log('starting a fast promise');
  return new Promise(resolve => {
  	setTimeout(function() {
    	resolve(10);
      console.log('fast promise is done');
    }, 1000);
  })
}

/* resolveAfter1Second(); */

var sequentialStart = async function() {
	console.log('sequential start');
  
  const slow = await resolveAfter2Seconds();
  const fast = await resolveAfter1Second();
  
  console.log(slow);
  console.log(fast);
}

/* sequentialStart(); */

var concurrentStart = async function() {
	console.log('concurrent start');
  
  const slow = resolveAfter2Seconds();
  const fast = resolveAfter1Second();
  
  console.log(await slow);
  console.log(await fast);
}

/* concurrentStart(); */

var stillConcurrent = function() {
	console.log('concurrent start');
  
  Promise.all([resolveAfter2Seconds(), resolveAfter1Second()]).then((messages) => {
    console.log(messages[0]);
    console.log(messages[1]);
  })
}

/* stillConcurrent(); */

var parallel = function() {
	console.log('parallel start');
  
  resolveAfter2Seconds().then((message) => {
  	console.log(message);
  })
  
  resolveAfter1Second().then((message) => {
  	console.log(message);
  })
}

/* parallel(); */