let sleepRaw = ms => new Promise(
  resolve => setTimeout(resolve, ms));

let sleep = async ms => {
  console.log('>');
  await sleepRaw(1000);
  console.log('<');
}

let getFavouriteColor = async () => {
  await sleep(1000);
  return 'red';
}

let getFavouriteStyles = async () => {
  await sleep(1000);
  return ['sporty', 'floral', 'modern'];
}

let getBall = async (color) => {
  await sleep(3000);
  return `a ${color} ball`;
}

let getBike = async (color) => {
  await sleep(3000);
  return `a ${color} bike`;
}

let buildItemList = async (items) => {
  await sleep(1000);
  if (items.length==0) {
    return 'nothing';
  }
  if (items.length==1) {
    return items[0];
  }
  return `${items.slice(0,-1).join(", ")} and ${items[items.length-1]}`;
}

let describeSceneSerial = async () => {
  let color = await getFavouriteColor();
  let styles = await getFavouriteStyles();
  let ball = await getBall(color);
  let bikes = [];
  for (const style of styles) {
    bikes.push(await getBike(style));
  }
  let itemList = buildItemList([ball, ...bikes]);
  return `You can see ${await itemList}.`;
  // 'You can see a red ball, a sporty bike, a floral bike and a modern bike.'
}

let describeSceneParallel = async () => {
  let color = getFavouriteColor();
  let styles = getFavouriteStyles();
  let ball = (async () => getBall(await color))();
  let bikes = (async () => Promise.all(
    (await styles).map(style => getBike(style))
  ))();
  let itemList = buildItemList([await ball, ...await bikes]);
  return `You can see ${await itemList}.`;
  // 'You can see a red ball, a sporty bike, a floral bike and a modern bike.'
}

let demo = async () => {
  console.log('Serial:');
  const serialResult = await describeSceneSerial();
  console.log(serialResult);
  console.log('Parallel:');
  const parallelResult = await describeSceneParallel();
  console.log(parallelResult);
}

demo();