브라우저의 작동방식에 대해서 설명해주세요.
웹 브라우저가 웹 서버에 필요한 자원(웹 페이지)을 요청하면
서버는 응답하고 웹 브라우저는 이를 해석한 후 사용자(Client)에게 보여준다.
브라우저는 서버로부터 HTML, CSS, Javascript, 이미지 파일 등을 응답받는다.
HTML, CSS 파일은 렌더링 엔진의 HTML 파서와 CSS 파서에 의해 파싱(Parsing)되어
DOM, CSSOM 트리로 변환되고 렌더 트리로 결합된다. 이렇게 생성된 렌더 트리를 기반으로 브라우저는 웹페이지를 표시한다.
자바스크립트는 렌더링 엔진이 아닌 자바스크립트 엔진이 처리한다.
HTML 파서는 script 태그를 만나면 자바스크립트 코드를 실행하기 위해
DOM 생성 프로세스를 중지하고 자바스크립트 엔진으로 제어 권한을 넘긴다.
제어 권한을 넘겨 받은 자바스크립트 엔진은
script 태그 내의 자바스크립트 코드 또는 script 태그의 src 어트리뷰트에 정의된
자바스크립트 파일을 로드하고 파싱하여 실행한다.
자바스크립트의 실행이 완료되면 다시 HTML 파서로 제어 권한을 넘겨서 브라우저가 중지했던 시점부터 DOM 생성을 재개한다.
이처럼 브라우저는 동기(Synchronous)적으로 HTML, CSS, Javascript을 처리한다.
이것은 script 태그의 위치에 따라 블로킹이 발생하여 DOM의 생성이 지연될 수 있다는 것을 의미한다.
따라서 script 태그의 위치는 중요한 의미를 갖는다.
브라우저의 종류는 다양하며 크롬, 네이버 웨일, 파이어폭스, 사파리 등이 있다.
브라우저는 동기(Synchronous)적으로 (HTML + CSS), Javascript 언어를 해석하여
내용을 화면에 보여주는 응용 소프트웨어다.
