DevTools (F12 or ctrl + shift + i ) > Network > Response 에서 확인 가능
Constructing
- HTML
- DOM Tree
- <HTML> 태그의 내용들 <head>, <body> 등
- load
- css, js
- CSS
- CSSOM
- Render
- Tree
Operating
- Layout
- 위치, 크기 지정
- Paint
- Layer 그리기
- Composition
- Layer 결합
큰 분류로는 Constructing 과 Operating 으로 구분되어 분류되며
소분류로는 앞 순서로 갈수록 웹이 그려질 때 더 많은 과정이 소모된다.
CSS 영향도 사이트
웹엔진
Blink : 크롬 Chrome
Gecko : 파이어폭스 FireFox
Webkit : 사파리 Safari
EdgeHTML : 구 엣지 브라우저 엔진 ( 최신 버전에선 Blink 로 변경됨 )
'Front-End > HTML&CSS' 카테고리의 다른 글
[CSS] css 메모 (0) | 2022.08.02 |
---|