[원티드프리온보딩] 220510

김듑듑·2022년 5월 11일
0

TIL

목록 보기
8/33

recoil

for state management
solve 3 basic issues
1. flexible shared state 👉 just rerender indivisual state
2. derived data and queries
3. app-wide state observation




가정1 리액트tree에 List 컴포넌트와 Canvas 컴포넌트에 items들이 있음
가정2 List의 2와 Canvas의 2끼리 corresponding 해야함




기존 react 작동방식

문제1 둘 사이가 너무 멀어서 ancestor까지 hoisting up + 리랜더 everything

문제2 items가 몇개나 될지 모르는 상황에서 생기는 issue들
insert new items 한다고 하면 위로 쭉쭉 알려줘야하고, 그 상황에서 entire tree를 unmount+remount해야함

문제3_ tree의 root와 leaf 사이의 coupling할때, code split 문제 발생




recoil 해결방법

기존 react tree 구조 위로 새로운 tree를 만듦 (2d👉3d)

flexible shared state 1

flexible shared state 2

상황1 derived data and queries 1

derived data and queries 2

derived data and queries 3


아 자꾸 글이 밀리는데 이건 TIL이 아니라 YIL....오늘 다시 당겨놔야지😭

0개의 댓글