리액트의 Virtual DOM 이란? (리액트가 빠른 이유)
이 글을 제대로 이해하려면 브라우저의 로딩 과정에 대해서 알아야 합니다. Virtual DOM? 가상 돔? 위 포스팅을 읽고 오셨다면 이제 리플로우가 뭔지 정확히 아셨을겁니다. 똑같은 Single Page Application을 자바스크립트나 제이쿼리로 구현한것과 리액트로 구현한것은 성능상의 큰 차이가 생깁니다. 우리가 바닐라 자바스크립트로 SPA를 구성하면 다음 프로세스를 거쳐야 합니다. 1. 변경하고자 하는 컴포넌트에 접근(querySelector, document.getElementById, document.getElementByClass 등..) 2. 컴포넌트를 조작 (show, hide, coloring 등등..) 3. 브라우저가 변화된 컴포넌트를 반영하기 위해서 리플로우 발생. 문제는 컴포넌트..
React
2020. 3. 26. 09:12
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- hydrate
- state
- reducer
- webpack
- reflow
- type alias
- promise
- async
- Polyfill
- props
- useRef
- typescript
- useEffect
- design system
- rendering scope
- react
- es6
- storybook
- Babel
- react hooks
- Next.js
- await
- reactdom
- Action
- atomic design
- return type
- javascript
- mobx
- server side rendering
- computed
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 |
글 보관함