[유데미x스나이퍼팩토리] 프로젝트 캠프 : Next.js 2기 - 사전직무교육 9일차 기록

 

학습 내용

• 리액트의 불변성
  • 데이터 변화를 감지할 때 원본데이터의 참조값이 변경되지 않았다면 값이 업데이트되지 않았다고 생각함
  • 주소값 내부가 바뀌었더라도 주소값이 바뀌지 않으면 업데이트되지 않았다고 생각함
  • 기본자료형은 상관없는데 (값이 바뀔 때마다 새로운 데이터라고 인식하기 때문)
  • 배열이나 객체(참조자료형)를 바꿀 때엔 항상 새로운 배열, 객체로 생성할 것!
• 랜더링 최적화 
• 메모이제이션
  • 특정값, 데이터를 기억하도록 보관하는 작업
  • 훅 useCallback(() => {}, [])
  • 훅 useMemo(() => {}, [])
  • 함수 React.memo()
  • 언제 다시 메모이제이션 되고 풀리는가에 대해 알기

• useReducer
  • 하나의 상태값을 단 하나의 함수에서 관리하는 것이 목적
• Context API
  • props drilling
  • 데이터를 관리하고 있는 곳(Context)을 만들어서 그곳에서 다른 컴포넌트 안 거치고 바로 데이터를 전달해줌
  • presentational component의 리랜더링 방지 방안: 메모이제이션 방법 활용하기!

 

진도가 몰아친다....

넘 빠르고 생각보다 넘 힘들다.. 꾸에엑..