[자바스크립트] 7. Eventloop

Single Thread로 다중 Process 처리

• PC 내에 발생하는 이벤트에는 File I/O, 통신, 그 외에 처리에 시간이 오래 걸리는 작업 등이 존재

• 이 이벤트들은 CPU가 대기 중인, 속된 말로 CPU가 멍때리는 시간이 생기는 모든 유형을 통칭
• Java 같은 Multi Thread 방식일 경우, 이벤트를 새로운 Thread에 맡기고 다른 업무를 진행
• JavaScript는 Single Thread로, 하나의 작업밖에 진행할 수 없음

어떤 페이지를 Rendering 중이라고 가정했을 때

• 페이지에 그릴 (render) 요소들을 준비
• Dom Tree에 구성 요소들을 배치

• 시간이 오래 걸리는 4번, 5번 이벤트의 경우 Eventloop이라는 별도의 queue에 저장
• Dom Tree에서도 별도로 구분

• Dom Tree의 구성이 완료되었다면 차례대로 Rendering 시작
• 이때, 오래 걸리는 4번, 5번 자리를 빼고 그림 (비동기적)
• 4번, 5번의 경우 Eventloop에 저장되어 완료되는 것을 스레드가 감시 (Listener)
• 이때, 스레드는 Rendering된 페이지와 Eventloop를 왕복하며 감시
• 페이지 내에 또 다른 이벤트가 발생할 수 있음 (ex. 2번의 버튼)
• Eventloop 내에 process가 완료되면, 우선 대기
• queue의 특성 : FIFO → 첫 번째 프로세스가 종료되어야 나머지 프로세스들도 종료됨
• 이후 발생하는 Event도 Eventloop에 저장되어 Thread가 감시