TIL - 2021.05.31

Today Ariticle

• 유용한 리액트 패턴 5가지

• 리뷰는 여기서 - 일일 아티클
  
  

그 외 오늘 참고한 아티클들

• [react] React.memo
• 리액트 styled components 애니메이션 구현
  

Today Commit Review

깃 commit 캡쳐 이미지

Today I Learned

• requestIdleCallack()
• lazy loading
  • lazy omponent loading (Dynamic JS Loading)
  • lazu image loading
  • Dynamic import

크롬 개발자 도구

• lighthouse.
  • 진단 항목이 성능 개선을 위한 포인트이다.
  • LCP, FID, CLS.
• DOMContentLoaded가 언제 실행됐나로 로딩 속도를 측정한다
• Performance - 모바일 - record - 검색 - stop

React dev tools

• profiling

React 최적화

• code splitting

  • React.lasy
  • React.Suspense. fallback. 자식에 렌더할게 없으면 올라와서 fallback내에 있는 내용을 render (loading...)

• lasy를 Suspense로 감싸는게 약간 국룰!

• useSWR, react-query 등 라이브러리도 관심 가져보기

• concurrent mode

• react server component

Today Review

• Recoil에서 해당 컴포넌트가 props를 받지 않고 직접 recoil로 상태를 가져온다면, React.memo는 사용할 수 없을까? recoil이 내부적으로 처리해줄까?