# Render Tree

10개의 포스트
post-thumbnail

DOM이란? 브라우저 렌더링? 렌더 트리(Render Tree) - DOM 정리

Document Object Model의 약자이자 html문서에 대한 인터페이스로 스크립트 언어와 프로그래밍 언어를 통해 웹 문서를 쉽게 제어할 수 있게 하기 위해 문서를 객체화한 것을 말한다.웹 브라우저가 HTML 문서를 읽어 들이면 위에 그림처럼 Document 객

2023년 10월 3일
·
0개의 댓글
·
post-thumbnail

DOM 이해하기

내가 만든 HTML 파일이 브라우저가 있을 때 DOM Tree로 변환되어브라우저 웹페이지상에서 나에게 보이게 되고 자바스크립트로 DOM Tree의각 요소(예, HTMLDivElement)에 접근하여 요소를 수정, 삭제, 추가 등을 할 수 있습니다.쉽게 말해서 DOM은

2023년 9월 28일
·
0개의 댓글
·
post-thumbnail

브라우저는 어떻게 렌더링 할까?

우리가 흔히 알고 있는 chrome, safari, opera 같은 브라우저는 어떻게 렌더링이 되는 걸까?\

2023년 1월 15일
·
0개의 댓글
·
post-thumbnail

브라우저 렌더링 과정 & 렌더링 최적화

브라우저 렌더링 : HTML, CSS, JavaScript 등 개발자가 작성한 문서가 브라우저에 출력되는 과정 브라우저는 기본적으로 렌더링을 수행하는 렌더링 엔진을 가지고 있다. 브라우저 렌더링 과정 사용자가 브라우저를 통해 웹 사이트에 접속한다. 브라우저는 서버로

2022년 11월 22일
·
0개의 댓글
·
post-thumbnail

[Web] 브라우저 동작 방법

웹을 접근하기 위한 기본 요소인 브라우저에 대해 알아보죠!

2022년 8월 8일
·
0개의 댓글
·
post-thumbnail

[Flutter] Stateless Widget vs Stateful Widget

데이터 UI(의 변경 가능성)에 영향을 미치는 App 단위의 변경 or Widget 단위(수준)의 변경 가능성이 있음 플러터 트리 Widget tree 개발자가 작성한 코드를 기반으로플러터가 build 메소드를 호출해서 생성 플러터에게 이런 UI를 그려달라고 알려주는

2022년 7월 17일
·
0개의 댓글
·
post-thumbnail

브라우저의 렌더링 과정

이번시간에는 브라우저가 서버와 어떻게 통신을 주고받으며 화면을 표시해주는지 알아보겠습니다.브라우저의 핵심 기능은 필요한 리소스(HTML, CSS, javascript 등)을 서버에 요청하고, 서버로부터 응답 받아 브라우저에 시각적으로 렌더링 하는 것입니다. 서버에서 필

2022년 3월 11일
·
2개의 댓글
·
post-thumbnail

[CS📖] 브라우저 렌더링

브라우저 렌더링 과정은 웹 개발자라면 필수로 알아둬야하는 개념이다. 이를 확실히 이해해야 렌더링 최적화를 수행하여 개발이 가능하다.HTML, CSS, JavaScript 등 개발자가 작성한 문서들을 브라우저가 화면에 그려주는 동작을 말한다. 각 브라우저는 렌더링을 하기

2021년 8월 22일
·
0개의 댓글
·

브라우저 렌더링

브라우저가 페이지를 렌더링하려면 먼저 DOM 및 CSSOM 트리를 생성해야 합니다. 따라서 HTML 및 CSS를 가능한 한 빨리 브라우저에 제공해야 합니다.참고: https://developers.google.com/web/fundamentals/perform

2021년 4월 20일
·
0개의 댓글
·
post-thumbnail

브라우저 렌더링

예전에 비슷한 글을 작성 했는데 한 번 더 정리가 필요한 거 같아서 글을 쓰게 되었습니다. Virtual DOMHTML CSS 파일은 각각 DOM Tree와 CSSOM 으로 만들어집니다. 파일을 연산과 관리에 유리하도록 Object Model로 만들게 됩니다.JavaS

2020년 5월 22일
·
0개의 댓글
·