Micro/Macro tasks

index.js

// https://www.youtube.com/watch?v=cCOL7MC4Pl0

const button = document.getElementsByTagName('button')[0]

button.addEventListener('click', () => {
  setTimeout(() => console.log('Timeout 1'))
  Promise.resolve().then(() => console.log('Microtask - 1'))
  console.log('task 1')
})

button.addEventListener('click', () => {
  setTimeout(() => console.log('Timeout 2'))
  Promise.resolve().then(() => console.log('Microtask - 2'))
  console.log('task 2')
})

/*

"task 1"

"Microtask - 1"

"task 2"

"Microtask - 2"

"Timeout 1"

"Timeout 2"

*/


// button.click()
/*


"task 1"

"task 2"

"Microtask - 1"

"Microtask - 2"

"Timeout 1"

"Timeout 2"

*/