async1 [ js ] defer vs async 브라우저는 HTML을 읽을 때 태그를 만나면 DOM생성을 멈추고 스크립트를 먼저 실행하는데, 이런 경우 아래와 같은 문제점이 발생함. 1. 스크립트가 먼저 작성된 경우 DOM요소에 접근할 수 없음. 2. 스크립트의 크기가 큰 경우 해당 스크립트를 다운받고 실행할 때까지 아래쪽 페이지를 볼 수 없음. 이런 문제를 해결할 수 있는 속성이 바로 defer와 async임. 두 속성은 기본적으로 페이지 렌더링을 막지 않는 공통점을 갖고 있으나 아래와 같은 차이점이 있음. defer - 페이지 생성을 막지 않아 페이지 콘텐츠가 바로 출력됨. - DOM이 준비된 후 실행됨. - DOMContentLoaded 이벤트 발생 전 실행됨. - 스크립트 크기와 상관없이 작성 순서에 맞게 실행됨. - 에 src 속성이 없으면 .. 2023. 4. 25. 이전1 1 다음 728x90 반응형