모던 웹브라우저에서 돌아가는 스크립트는 HTML보다 대부분 무거움
브라우저는 HTML을 읽다가 script 태그를 만나면 스크립트를 먼저 실행해야하기 때문에 DOM생성을 멈추게 됨
위에서 언급했듯이 HTML로 DOM을 생성하다가 script태그를 만나면 js부터 fetching하고 executing하게 됨으로
script의 용량에 따라 사용가자 웹을 보기까지 시간이 오래 걸리게 되는 문제가 발생하게 됨
head태그에 script를 작성하여 발생하는 부작용을 해결하기 위해 body태그 끝에 script를 작성하게 되면
js에 굉장히 의존적인 웹사이트를 사용자가 방문시 정상적인 화면을 보기 어려울 수도 있음
이러한 문제를 해결할 수 있는 script 속성이 defer와 async임
HTML을 읽는 것과 병렬적으로(독립적으로) script가 fetching, executing 됨 => 다운로드 시간 절약
그렇지만, 여러 js파일들 중 먼저 다운받아진 순서대로 실행이 되기 때문에 실행순서가 중요한 프로젝트에서는 문제가 될 수 있음
또한, 원하는 DOM이 아직 정의되지 않았을 때 js가 먼저 실행될 수도 있음
HTML을 읽으면서 병렬적으로 js가 fetching됨 => 그 이후 페이지 세팅이 완료된 뒤 js가 executing 됨
만약, 웹사이트가 실행순서에 의존적이라면 defer을 사용하는 것이 효율적일 수 있음