async와 defer의 차이점

용어 사전 학습

parsing : 문법을 분석하는 것.

fetching : 가져오는 것

executing : 실행하는 것.

01. async

---

Process

- HTML이 파싱되는 동시에 JS파일을 다운받고 실행시킨다.

문제점

- HTML이 완전이 parsing되기 전에 JS파일이 실행될 수 있다.

 

02. defer *추천*

---

Process

- HTML이 파싱되는 동안 JS파일을 다운 받고,  HTML 파싱이 끝나면 JS파일을 실행한다.

 

추천

defer는 가장 효율적이고 안전한 방법이다.

 

 

 

---

Process

 

 

문제점

JS파일 클경우에는 사용자가 오래 기다려야 한다는 단점이 있다.

 

 

 

Reference : https://www.youtube.com/watch?v=tJieVCgGzhs&list=PLv2d7VI9OotTVOL4QmPfvJWPJvkmv6h-2&index=2