리액트의 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
- Babel
- reducer
- hydrate
- await
- async
- react
- design system
- typescript
- rendering scope
- mobx
- type alias
- storybook
- es6
- props
- server side rendering
- promise
- useEffect
- useRef
- return type
- Polyfill
- reactdom
- state
- computed
- javascript
- reflow
- Next.js
- Action
- webpack
- react hooks
- atomic design
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 |
글 보관함