일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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
- RTK Query
- recoil
- 투포인터
- CI/CD
- Cypress
- tailwind
- app router
- 공변성
- 리터럴 타입
- 인터섹션
- 결정 알고리즘
- map
- dfs
- async/await
- 호이스팅
- ESlint
- CORS
- useAppDispatch
- TS
- 반공변성
- Promise
- 무한 스크롤
- Jest
- autosize
- React
- 이분 검색
- 태그된 유니온
- webpack
- 타입 좁히기
- SSR
Archives
- Today
- Total
목록리렌더링 (1)
짧은코딩
리렌더링과 인라인 스타일
리렌더링 리엑트에서 리렌더링이 되면 return 밑 부분을 처음부터 실행하지만 바뀐 부분만 다시 그리게 된다.(return 부분이 virtual dom이다.) 만약 리렌더링 되었을 때, 모든 화면을 다시 그려준다면 개발자들이 리엑트를 사용하지 않을 것이다. 번외로 useCallback은 함수를 캐싱하는 것이고 useMemo는 결과를 캐싱하는 것이다. 인라인 스타일 코딩을 하다보면 인라인 스타일을 많이 쓰게 된다. 이런 방식은 지양하는 것이 좋다. 왜냐하면 객체는 "{} === {}"을 하면 false가 나온다. 그렇기 때문에 리렌더링하면 인라인 스타일 부분을 사용한 곳을 다시 그리게 된다. 해결법으로는 styled-components, emotion.js 등 같은 js-in-css를 사용하면 된다. an..
인프런, 유데미/React로 트위터 만들기
2022. 11. 23. 00:56