일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- 자바스크립트
- React JS
- 프로그래머스 자바
- 프로그래머스
- codesandbox
- design pattern
- NextJS
- 컴퓨터 네트워크
- useState
- websocket
- 자바
- 코틀린
- 디자인 패턴
- 데이터모델링과마이닝
- Java
- 프로그래밍 언어론
- react hook
- react
- 코딩테스트 고득점 Kit 완전탐색
- 코딩테스트 고득점 Kit
- 프로그래머스 완전탐색
- vanillaJS
- 리액트
- 자바 공부
- 백준
- 장고
- react firebase
- 리액트 훅
- JavaScript
- useEffect
Archives
- Today
- Total
목록repaint (1)
기록하는 개발자
브라우저의 렌더링 과정과 Reflow, Repaint
브라우저의 렌더링 과정 Parsing→Style→Layout→Paint→Composite Parsing(DOM Tree, CSSOM Tree 구성) HTML 파일과 CSS 파일을 파싱해서 각각 Tree를 만든다. 브라우저가 페이지를 렌더링하려면 가장 먼저 받아온 HTML 파일을 해석해야한다. Parsing 단계는 HTML 파일을 해석하여 DOM(Document Object Model) Tree를 구성하는 단계이다. CSS가 포함되어 있다면 CSSOM(CSS Object Model) Tree 구성 작업도 함께 진행한다. Style(Render Tree 구성) Parsing 단계에서 생성된 DOM Tree와 CSSOM Tree를 매칭시켜서 Render Tree를 구성한다. Render Tree는 실제로 화면..
Web
2023. 12. 19. 18:39