로니의 개발 이야기

브라우저의 핵심 기능은? 사용자가 참조하고자 하는 웹페이지를 서버에 요청(request)하고 서버의 응답(response)을 받아 브라우저에 표시하는 것이다. 자원의 주소는 URI에 의해 정해진다. 그렇다면 브라우저는 어떻게 동작할까? 브라우저는 서버로부터 HTML, CSS, Javascript, 이미지 파일 등을 응답받는다. 렌더링 엔진은 HTML 문서를 파싱 해서 각각의 태그를 DOM 노드로 변환하여 DOM 트리를 생성하고 CSS 문서를 파싱 해서 CSSOM 트리를 생성한다. 그리고 이 둘을 결합하여 렌더 트리를 만들게 된다. 그 다음은 레이아웃 단계이다. 이 단계에서는 각 노드의 크기와 위치, 레이어 간 순서와 같은 정보를 계산하여 어디에 배치할지, 어떤 크기를 가질지가 정해진다. 페인팅 단계에서는..

이것은 Ire Aderinokun이 작성하고 bitsofco.de에 게시된 ' What, exactly, is the DOM? '을 번역하고, 수정한 글이다. 여기에서 원본 article 읽기 1. DOM은 무엇일까? 문서 객체 모델 (Document Object Model) DOM은 웹 페이지에 대한 인터페이스로, 현재 웹페이지의 문서 모델을 의미한다. 웹 문서를 브라우저가 이해할 수 있는 구조로 구성하여 메모리에 적재하게 되는데 이를 DOM이라고 한다. DOM은 기본적으로 여러 프로그램들이 페이지의 콘텐츠, 구조, 스타일에 접근할 수 있게 하고 수정할 수 있도록 API를 제공한다. 또한 사용자의 동작에 반응할 수도 있게 된다. DOM의 최상위 객체인 document 객체는 HTML 전체 페이지를 표현..