Callback queue, task queue, event loop 헷갈리는 개념 정리

신호승·2021년 3월 14일

많은 블로그에서 브라우저의 Task Queue에 대해 다루고 있는데 이에 대해 상반된 내용이 많아서, 저 나름대로 정리하기 위해 작성되었습니다. 잘못된 내용이 있을 수 있으니 피드백 부탁드립니다.

1. Task queue는 callback queue와 같은 개념이다?

Callback queue는 Task queue 의 한 종류일 수 있음.
Task queue는 html standard에서 사용되는 정식 명칭임.
Callback queue는, 아무리 찾아봐도 정식 명칭은 아님. html standard에도 그 개념을 찾을 수 없으며, callback queue에 대해 정리해놓은 블로그들을 찾아가 보면 결국, 이 영상과 이 글이 그 출처였음.
이 영상과 글은 javascript의 이벤트 루프에 대해 직관적으로 잘 설명되어 있어서 개념 잡기에 좋으나, 문제의 callback queue와 task queue를 혼용해서 사용하고 있으며, callback queue에 대한 어떤 reference도 제공해 주지 않음.
html standard을 기반으로 callback queue를 분석해 본다면, callback queue는 사용자 이벤트와 같은 비동기 작업들의 task source에 대응되는 task queue의 한 종류 일 수 있으며, 실제로 있는지는 확실하지 않음.
확실하지 않은 이유는 html standard 자체가 task source를 느슨하게 정의해 놓았기 때문에, 실제 구현은 각자 브라우저에서 서로 다른 명칭으로 구현 되어 있을 수 있기 때문임.
따라서, 결론적으로 callback queue는 브라우저가 가지는 여러 task queue 중 하나일 수 있으나, 확실히 있는 지 없는지는 V8 엔진이나 다른 엔진을 까보기 전에는 확신하지 못함. (구현체의 실제 내부 명칭이나 기능 또한 다를 수 있음)

반은 맞고 반은 틀림
Task는 기본적으로 event loop의 task queue에서 처리되는 일의 단위이며, task source로부터 생성됨
Task의 종류에는
- Script
- Event
- HTML parse
- Callback
- Resource (비동기로 요청되는 컨텐트들이 도착했을 때 처리할 일)
- Reacting to DOM manipulation (javascript로 DOM을 조작할 경우, 실제 javascript 실행이 끝나고 DOM을 조작하는 task)
등이 있음
위에서 HTML parse, Resource, Reacting to DOM manipulation은 javascript로 동작하는 task들이 아님
Callback이나 Event, Script를 처리할 때만 V8과 같은 엔진을 통해 javascript를 실행하는 것임
이렇기 때문에 task queue나 event loop는 V8 엔진 내부에 있는 것이 아닌, 외부에 존재하며 필요할 때만 V8 엔진을 통해 작업을 함

맞음.
우선순위의 정도는 microtask = rendering > task 순서임 - 더 자세히는, 브라우저마다 다를 수 있음
참고 : 이벤트 루프 동작 과정 - event loop proceeding model
1. 먼저 task queue에서 runnable task를 하나만 꺼내 실행함
2. 그 후 microtask queue가 전부 비워질 때까지 microtask를 모두 실행함
3. 그 후 렌더링 할 게 있는지 확인하고(Rendering Opportunity) 있으면 렌더링을 함
4. 다시 첫번째로 돌아가서 무한히 반복하며, 일할 게 없으면 휴면 상태에 들어감