일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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
- 디자인 패턴
- useEffect
- 데이터모델링과마이닝
- 장고
- 자바스크립트
- 리액트
- react hook
- design pattern
- useState
- vanillaJS
- 자바
- codesandbox
- 코틀린
- 프로그래밍 언어론
- react firebase
- 백준
- 프로그래머스 완전탐색
- Java
- 코딩테스트 고득점 Kit 완전탐색
- websocket
- 프로그래머스 자바
- JavaScript
- NextJS
- 컴퓨터 네트워크
- React JS
- 리액트 훅
- 코딩테스트 고득점 Kit
Archives
- Today
- Total
목록Reflow 최소화 (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