React

불변성:

- 리액트는 state의 변경점을 찾아 화면을 재렌더링 한다
- 사이드 이펙트를 줄이기 위해 

재렌더링 조건:

- state가 변경되었을 때
- props 값이 변경 되었을 때
- 부모 컴포넌트가 재렌더링 되었을 때

객체

객체는 변수 메모리 공간에
객체가 있는 메모리 공간의 주소를 담고 있다
-> 참조에 의한 호출, 얕은 비교를 함

변수를 공유하지 않는 한 모든 객체는 새로운 객체다

객체를 state로 관리

const [obj, setObj] = useState({})

객체의 특징 때문에 state로 관리하면 다음과 같은 문제를 겪는다

1. 불변성을 지키기 위해 state에 새로운 객체를 만들어서 넣어야 함
2. 값의 변화에 상관 없이 무조건 재렌더링이 일어남

위 두가지 문제점은 성능에 직접적인 영향을 준다

새로운 객체를 만들기 위해
기존 객체의 값을 복사해서 새롭게 만드는 비용이 들고

불필요한 렌더링이 계속 일어나게 된다

리액트는 렌더링을 잘 견디게 설계되어 있고
되도록 렌더링을 막는 행위는 지양하는 것이 리액트스럽다고 한다

불필요하게 일어나는 일을 미리 차단한다면
조금 더 나은 사용자 경험을 주지 않을까 싶긴 하지만
막상 그렇게 유의미한 고민은 아닐 수도 있다..