# script 태그 async, defer 속성

브라우저에서 HTML 다운로드가 끝나면 HTML 파서는 파싱을 하다가 script 태그를 만나면 하던 일을 중단하고 자바스크립트 엔진에 제어 권한을 위임한다. script 태그의 위치에 따라서 페이지 로딩이 지연되는 현상이 발생할 수 있고 script에서 DOM을 조작하는 코드가 있을 경우, DOM이 아직 다 만들어지지도 않았는데 실행되어 에러가 발생하는 문제도 있다. 때문에 일반적으로 script 태그를 body태그의 맨 마지막 부분에 삽입하는 것을 권장한다.

HTML5에서는 script 태그에 async와 defer 속성이 추가되었는데, js를 blocking 없이 비동기로 다운로드 받고, 실행 시점을 선택할 수 있는 옵션을 제공한다.

각 옵션의 차이는 다음 이미지에 잘 나타나있다.