브라우저는 HTML을 순차적으로 위에서 아래로 파싱하면서 DOM 트리 생성

<script> 태그를 만나면 브라우저는 파싱을 멈추고 Javascript를 실행

• 이유: JS 코드 안에서 DOM을 조작할 수 있기 때문

• 파싱 중 JS 실행으로 인해 DOM 구조가 변경되면 충돌/불일치 발생

• 안전하게 Blocking 처리

<script> 태그의 블로킹 제어 속성: defer, async

<script src="app.js"></script>

• HTML 파싱 멈춤 → JS 다운로드, 실행 → 파싱 재개

<script src="app.js" defer></script>

• HTML 파싱과 동시에 JS 다운로드

• 하지만 실행은 파싱이 끝난 후 (DOM 완성 후)

• 여러 개 있을 때 실행 순서 보장

<script src="app.js" async></script>

• HTML 파싱과 동시에 JS 다운로드

• 다운로드 완료되면 즉시 실행 → 파싱 잠시 Blocking

• 여러 개 있을 때 실행 순서 보장 X