개발에 AtoZ까지

◆목표 JS Import 하는 방법과 차이점 HTML에 Import 하는 방법 1) Head 태그에 JS를 import 하는 방법 2) Body 태그에 JS를 import 하는 방법 3) Head 태그에 async를 붙여서 JS를 import 하는 방법 4) Head 태그에 defer를 붙여서 JS를 import 하는 방법 Import 방법별 브라우저 파싱 단계 및 특징 Head 태그에 JS를 import 하는 방법 html 파일을 위에서부터 순차적으로 파싱하다가 head 부분에 있는 script 태그를 만나면 해당 src에 있는 파일을 다운로드 한다. parsing HTML. => blocked (fetching js / executing js 파일 다운) => parsing HTML 단점: 만약 다운..

◆목표 DOM의 정의 웹브라우저 동작과정 BOM의 정의 1. DOM(Document Object Model)의 정의 -구조화된 문서(Document)를 객체로 표현하는 방식 2. 웹브라우저 동작 과정 1) HTML 파일을 웹서버로 부터 가져옴 2) 가져온 HTML 파일을 파싱(Parsing) 하여 Dom Tree 생성, Css 정보를 파싱(Parsing)하여 Cssom Tree 생성 3) 파싱한 Dom Tree와 Cssom Tree를 기반으로 Render Tree를 생성 4) 생성한 Render Tree로 Rendering을 하고 그것으로 사용자에게 페이지를 보여줌 Tip) 자바스크립트 선언 위치 - HTML 코드를 기반으로 DOM 트리를 구성하기 때문에 DOM 트리를 구성하기 전에 자바 스크립트로 HT..