브라우저 로딩 과정
처음 웹페이지에 접속하면 브라우저는 서버로 요청을 보내 html, css, js 등의 파일을 다운로드 받고 파싱해서 화면에 보여준다. 이러한 브라우저 로딩과정은 다운로드, 파싱, 스타일, 레이아웃, 페인트, 합성 총 6단계로 나누어진다. 다운로드 유저가 브라우저에서 www.naver.com를 입력했을때, 브라우저는 naver의 서버로 html을 요청해서 응답을 받는다. 파싱 다운받은 html을 파싱한다. 파싱을 하면서 DOM Tree를 만들게 되는데, 파싱 도중에 link태그를 만나면 서버에서 CSS파일 다운로드하고 파싱해서 CSSOM Tree를 만든다. 스타일 HTML과 CSS의 파싱이 완료되면 DOM Tree와 CSSOM Tree를 합쳐서 Render Tree를 생성한다. DOM Tree에는 CSS로..
Today I Learned
2020. 3. 20. 09:23
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- Babel
- Next.js
- atomic design
- javascript
- design system
- webpack
- react hooks
- server side rendering
- Action
- Polyfill
- mobx
- await
- react
- reflow
- es6
- rendering scope
- async
- typescript
- useRef
- return type
- reducer
- computed
- props
- promise
- storybook
- state
- useEffect
- type alias
- reactdom
- hydrate
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
글 보관함