JS) Script async 이랑 defer 차이

Script async

html을 쭉 읽다가

script async를 발견하면 다운받는다.

(이 다운 상황에도 html은 계속 읽는 중)

그러다가 script async 이 다운 다 받았어!

그럼 야 html 그만 읽어 하면서 멈춘(blocked)다.

그리고 js를 짠 보여준다.

 

만약

<script async src="하나.js"></script>
<script async src="둘.js"></script>
<script async src="셋.js"></script> //이게 겁나 가벼운 파일임

 세번째 js파일이 겁나 가벼워서 빨리 다운이 끝났다?

그럼 화면 멈추고 첫번째, 두번째 파일 제치고

세번째 js파일을 똿 보여줌.

다 비켜 비켜

그래서 만약 순서대로 js가 실행되야 하는

사이트를 만들고 싶으면

조금 곤란쓰.

Script defer

하지만

defer은

html을 읽는 동안 다 다운 받아 놓고 

html을 기다렸다가

짜잔 널 위해 준비했어하고 

모든 js 파일을 몽땅 보여준다.