Recoil - team-yaza/mozi-client GitHub Wiki
Recoil์ Facebook์์ ๋ง๋ React๋ฅผ ์ํ ์ํ๊ด๋ฆฌ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ด๋ค. Redux์ ์ํ๊ด๋ฆฌ๋ ๊ธฐ๋ณธ์ ์ผ๋ก ์์ฉ๊ตฌ ์ฝ๋(boilderplate code)๊ฐ ๋ง์ด ๋ฐ์ํ๋๋ฐ๋ค combineReducer๋ฅผ ํตํ reducer ๋ถํ ์ด ๊ฐ๋ฅํ๋ค ํ๋๋ผ๋ Recoil์ atom๊ณผ ๊ฐ์ ์ ์ฐํจ์ ๊ฒฐ์ฝ ์ ๊ณตํ ์ ์๋ค. ์ปดํฌ๋ํธ์ useMemo์ฒ๋ผ ํ์ ๋ฐ์ดํฐ๋ฅผ ์์ฑํ ์ ์๋ ๊ธฐ๋ฅ์ ์์ฒด์ ์ผ๋ก ๊ฐ์ง๊ณ ์์ง ์์์ reselect๊ฐ์ ์ธ๋ถ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ํ์ ๋น๋ ค์ผํ๋ค. ๊ทธ๋ฆฌ๊ณ atomEffect ์ฒ๋ผ ํน์ ์ํ๊ฐ ์ ๋ฐ์ดํธ๋์์ ๋ ์คํํ ์ฌ์ด๋ ์ดํํธ๋ ์์ฒด์ ์ผ๋ก ์ ์ํ ์ ์์ผ๋ฉฐ ์ปดํฌ๋ํธ์์ ์ํ๋ฅผ ๊ตฌ๋ ํ ํ useEffect ์์์ ๊ตฌํํด์ผํ๋ค. Redux ๋ฏธ๋ค์จ์ด๋ ์ํ ์ ๋ฐ์ดํธ ํ์ ์คํ๋๋ ๊ฒ์ด ์๋๋ผ dispatch๋ ๋ชจ๋ ์ก์ ์ด ๊ฑฐ์ณ๊ฐ๋ ๊ณณ์ด๋ผ ์ฑ๊ฒฉ์ด ๋ค๋ฅด๋ค.
Redux์ ์ํ ๊ตฌ์กฐ๋ ํธ๋ฆฌํํ์ด์ง๋ง Recoil์ ์ ํฅ ๊ทธ๋ํ(directed graph) ํํ๋ก ๊ตฌ์ฑ๋๋ค.
Recoil์์ ๋ฐ์ดํฐ์ ์์ค์ธ atom์ ๊ณ ์ ํ ๋ฌธ์์ด ํค๋ฅผ ๊ฐ์ง๋๋ฐ, Recoil์ atom์ ํค๋ฅผ ๊ตฌ์ฑํ๋ ์ํ๋ฒณ์ ๋
ธ๋๋ก ํ์ฌ ๊ทธ๋ํ๋ฅผ ๊ตฌ์ฑํ๋ค.(Trie)
Recoil์์ atom์ ํค๋ ๊ณ ์ ํ ๊ฐ์ ๊ฐ์ ธ์ผํ๋ฏ๋ก ๊ทธ๋ํ ์์ ๋
ธ๋์๋ ์ธ์ ๋ 1๊ฐ์ atom๋ง ์กด์ฌํ๊ฒ ๋๋ค. ์ด๋ ๊ณง atom์ด ๋ค๋ฅธ atom์ ์ํฅ์ ๋ฐ์ง ์๋ ๋
๋ฆฝ์ ์ธ ์ํ๋ผ๋ ๋ง์ด๊ธฐ๋ ํ๋ค. Redux์์ ๊ทธ๋ฌ๋ ๊ฒ์ฒ๋ผ reducer๋ฅผ ๊ตฌํํ ๋ ์
๋ฐ์ดํธ ๋์์ด ์๋ ๊ฐ(=์ํ ๊ฐ์ฒด์ ๋ค๋ฅธ ํ๋)๋ค์ ๋ถ๋ณ์ฑ์ ๋ณด์ฅํ๊ธฐ ์ํด immutable.js,immer๊ฐ์ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ์ฌ์ฉ์ ๊ณ ๋ คํ ํ์๊ฐ ์๋ค.
์ด ์ธ์๋ Recoil์ React์ ๋์์ฑ ๋ชจ๋(Concurrent Mode) ๋ฐ ์ ๊ท ๊ธฐ๋ฅ๊ณผ์ ํธํ์ฑ์ด ์ ๊ณต๋ ์ ์์ผ๋ฉฐ atom, selector ์ฑ ๊ฐ๋ฐ์ ๋ฐ๋ผ ์ ์ง์ ์ผ๋ก ์ถ๊ฐํ ์ ์์ด์ ์ฝ๋ ๋ถํ ์ ์ฉ์ดํ๋ค๋ ์ , ๋น๋๊ธฐ selector๋ฅผ ํตํ ์๊ฒฉ ๋ฐ์ดํฐ ๊ตฌ๋ ๋ฑ ๋ค์ํ ํน์ง์ ๊ฐ์ง๊ณ ์๋ค.