<script src="경로"></script>
<script async src="경로"></script>
기본은 html 코드를 읽다가 '<script'> 부분을 보면 html 코드 읽던 걸 잠시 멈추고 해당 스크립트 파일을 다운 받아 오는데, async 는 병렬 방식으로 DOM도 그리면서 script 를 다운 받아 온다.
장점 : 스크립트를 다운 받는 시간이 별도로 없기 때문에 상대적으로 기본 script 다운 방식 보다 로드가 빠르다.
단점 : script가 다 받아지면 DOM이 멈추고 스크립트를 실행하기 때문에 어차피 스크립트에서 오류가 나면 페이지가 멈춘다.
<script defer src="경로"></script>
DOM을 로드하면서 동시에 script 들을 다운만 받는다.
DOM이 다 로드된 후, 다운받은 스크립트를 실행한다.
장점 : 외부파일이 여러 개인 경우, DOM 구조가 그려지는 동안 다운받은 script 들을 코드 순서대로 실행하기 때문에 로드가 빠르다.
header 안에 명시하면서 랜더링 이후 동작시킬 거면 defer 쓰는 게 좋다.