// Open your console to see the execution of the methods in real-time

/**
 * Returns the execution time of an asynchronous operation
 * @param {*} task 
 * @returns {Number} total
 */
const getExecutionTime = async (task) => {
  let startTime;
  let endTime;
  
  startTime = performance.now();
  await task();
  endTime = performance.now();
  
  return (endTime - startTime);
}

const getUserData = async () => {
  // Get a random dog as our user's avatar
  const res = await fetch('https://dog.ceo/api/breeds/image/random')
  const { message } = await res.json()
	
	// Get our user's general data
	const user = await fetch('https://randomuser.me/api/')
	const { results } = await user.json()
}

const getUserDataFast = async () => {
  const [res, user] = await Promise.all([
    fetch('https://dog.ceo/api/breeds/image/random'), 
    fetch('https://randomuser.me/api/')
  ])
  const [{ message }, { results }] = await Promise.all([res.json(), user.json()])
}

/**
 * Run the above method X times and log the average run time
 */
const start = async (method, totalExec) => {
	let total = 0
  
  console.log(`Starting ${totalExec} runs`)

	for (let i = 0; i < totalExec; i++) {
		const time = await getExecutionTime(method)
		total = total + time
	}

	console.log(`Average execution time for ${totalExec} runs: ${total / totalExec}`)
}

////////

const totalExecInput = document.querySelector('.input__total-executions')
totalExecInput.value = 10

document.querySelector('.button__await').onclick = () => { start(getUserData, totalExecInput.value) }

document.querySelector('.button__all').onclick = () => { start(getUserDataFast, totalExecInput.value) }