학습 공간 개념 · 판단 · 실험

Fanta Lab

질문 28 · 실전 면접 답변

이벤트 루프·마이크로태스크·Worker·requestAnimationFrame은 어떻게 다른가요?

이렇게 답해 보세요 (핵심 답변)

이벤트 루프는 호출 스택이 비었을 때 대기 중인 작업을 꺼내 실행하며 브라우저의 메인 스레드 흐름을 조율하는 메커니즘입니다. 타이머나 클릭 이벤트는 일반 태스크(매크로태스크)로 스케줄되지만, Promise.then이나 queueMicrotask는 현재 실행 중인 코드가 끝난 직후의 마이크로태스크 체크포인트에서 큐가 빌 때까지 먼저 실행됩니다. 또한 화면을 그리기 직전의 프레임 타이밍에 맞추려면 requestAnimationFrame을 쓰고, 무거운 CPU 연산을 메인 스레드와 분리해 병렬로 처리하려면 DOM 접근이 없는 Web Worker를 사용합니다.

함께 설명하면 좋은 이유 (꼬리질문 대비)

  1. 마이크로태스크는 다음 렌더링이나 일반 태스크보다 먼저 실행되므로, 마이크로태스크를 끝없이 이어 붙이면 화면 갱신과 입력 처리가 지연됩니다.
  2. Web Worker로 연산을 옮길 때는 순수 계산 시간뿐 아니라 데이터를 직렬화하거나 전송하는 메시지 비용도 함께 고려해야 합니다.

면접에서 자주 하는 실수

타이머, Promise 콜백, requestAnimationFrame이 모두 똑같은 단일 선입선출(FIFO) 큐 하나에 순서대로 줄 서 있다고 설명하지 않습니다.

원리와 예제까지 읽기

공식 참고 자료

질문 목록 출처 ↗ · 원본 28번을 바탕으로 질문과 답변을 새로 정리했습니다.

← JavaScript