브라우저
-
브라우저 렌더링 원리개발공부/CS 2023. 11. 9. 10:34
오늘은 브라우저 렌더링에 대해 알아보고자 한다. HTML 파싱 후 DOM 트리 구축 CSS 파싱 후 CSSOM 트리 구축 JavaScript 실행 DOM과 CSSOM를 조합하여 렌더트리 구축 뷰포트 기반으로 렌더트리의 각 노드가 가지는 정확한 위치와 크기를 계산 (Layout 단계) 계산한 위치 및 크기를 기반으로 화면에 그림 (Paint 단계) 위에 과정을 통해 브라우저가 렌더링된다고 한다. 하지만 나는 아직 완벽하게 이해하지 못했기 때문에 하나씩 차근 차근 알아보고자 한다. 브라우저란? 동기적으로 HTML, CSS, JS 언어를 해석하여 내용을 화면에 보여주는 프로그램 CSSOM (CSS Object Model) CSS 내용을 파싱하여 자료를 구조화 한 것 즉, CSS 내용을 해석하고 노드를 만들어 ..