자바스크립트 실행과 페이지 렌더링은 별개다

sample

document.body.innerHTML = 'Hello';

var time = 3000;
var date = new Date().getTime() + time;
var curDate = new Date().getTime();

while(curDate < date) {
  curDate = new Date().getTime();
}

 

위 코드 실행 시 반복문에 다 돌고 난 뒤 페이지에 Hello가 찍히게된다.

 

innerHTML은 동기코드인데 왜 반복문이 다 돌고나서 찍히게 될까?

 

자바스크립트 실행과 페이지 렌더링을 별개이다.

 

자바스크립트 실행 이후 페이지 렌더링을 실행하게 된다.

 

단, 디버깅으로 보게되면 먼저 'Hello'가 렌더링이 된다.