[Javascript] - 기초 01. async, defer
in Web on Javascript
JavaScript를 HTML 파일에 불러 오는 방법
...
<script src="main.js"></script>
...
<body>
...
</body>
이렇게 하면 HTML 구조 안에서 순서대로 진행하기 때문에 script문서를 도중에 불러 오게 된다.
그렇기 때문에 js 파일이 크다면 중간에 load
하느라 화면이 불러오는데 delay
가 발생할 수 있다.
옛날에는 그래서 script구문을 맨 아래에 넣는 방법으로 대처하였었다.
하지만 이 방법도 javascript에 의존적인 웹사이트면 결국 기다려야하는 문제가 발생한다.
async
그래서 비동기로 js 파일을 불러오는 async 방법이 있다.
<script async src="main.js"></script>
하지만 이 방법도 js파일이 여러개이면서 서로 js파일이 의존적이라면 문제가 발생 할 수 있다.
js파일들이 동시에 불러와지고 실행이 동시에 되면 의존성 문제가 발생 할 수 있다.
defer
그래서 defer를 쓰면 이 문제가 해결된다.
<script defer src="main.js"></script>
defer는 async처럼 파일들을 비동기로 불러오지만 실행은 순차적으로 진행되기 때문에 (html이 준비가 되고 나서)
의존성 문제가 발생하지 않는다.
앞으로 defer를 써서 js를 불러오자.
추가로 항상 JS 코딩 할 때
'use strict';
를 사용하자 문법을 강화해 에러를 사전에 어느정도 방지(?) 할 수 있다.