웹 브라우저의 렌더링 과정

워낙 잘 정리된 글이 많지만, 머릿속에 한 번 더 새길 겸 적어봅니다...! [과정 요약] 불러오기 : 로더가 서버로부터 전달 받는 리소스를 읽는 과정을 의미한다. 파싱 : HTML 파서가 문서를 파싱해서 DOM Tree 를 만들게 된다. 렌더링 트리 만들기 : DOM Tree는 내용을 저장하는 트리로 자바스크립트에서 접근하는 DOM 객체를 쓸 때 이용하므로 별도로 그리기 위한 트리가 만들어져야 하는데 그것을 렌더링 트리라고 의미한다. 스타일 구조체 생성 : CSS 선택자에 따라서 적용되는 태그가 다르기에 모든 스타일을 분석하여 태그에 스타일 규직이 적용되게 결정한다. 레이아웃 : 렌더링 트리에서 위치, 크기를 가지고 있지 않기 때문에 객체들에게 위치, 크기를 지정해주는 과정을 의미한다. 그리기(=페인트..
Programming/Browser 2019. 11. 22. 11:04
1