이벤트 루프 작동 방식

1. 매크로 태스크의 오래된 Task를 실행시킴
2. 마이크로 태스크의 모든 Task를 실행시킴
   1. 새로 추가된 Task들까지 포함해서 실행시킴
3. 렌더링 작업 수행
4. 위의 1-3 작업 반복

• 브라우저는 시간이 오래 걸리든 아니든 상관없이 현재 작업 중인 태스크가 끝나야 DOM 변경 분을 화면에 렌더링합니다.
• 자바스크립트 엔진은 매크로태스크 하나를 처리할 때마다 또 다른 매크로태스크나 렌더링 작업을 하기 전에 마이크로태스크 큐에 쌓인 마이크로태스크 전부를 처리합니다.

참고

https://velog.io/@yejineee/이벤트-루프와-태스크-큐-마이크로-태스크-매크로-태스크-g6f0joxx

https://ko.javascript.info/event-loop

https://ko.javascript.info/microtask-queue