리액트 최적화

같은 목적의 코드는 뭉쳐두자=> 핵심 데이터만 전달받고 세부 구현은 뭉쳐 숨겨 두는 개발 스타일 (선언적 프로그래밍)하나의 함수는 하나의 일만하자 한글 변수명도 사용하자 적당히 추상화 하자.서로 다른 차원의 추상화 코드를 한번에 나열하지 말자.

react beta에서 지원하는 suspense는 비동기를 동기적으로 바꿔주어 잘 처리하는데axios 보다 좋다. recoil에서는 async selector로, swr과 react query에서는 {suspense: true}로 suspense 기능을 이용한다.

여기서 useState (createBulkTodos())라고 작성하면 리렌더링될 때마다 createBulkTodos 함수가 호출되지만, useState(createBulkTodos)처럼 파라미터를 함수 형태로 넣어 주면 컴포넌트가 처음 렌더링될 때만 createBul

리액트에서는 렌더링이 되는 대표적인 조건이 몇 가지 있다. state 변경이 있을 때부모 컴포넌트가 렌더링 될 때새로운 props이 들어올 때shouldComponentUpdate에서 true가 반환될 때forceUpdate가 실행될 때이 중에서 1번과 2번은 얕은 비

객체 가공할때는 자식 컴포넌트에서 하는게 좋으므로 객체 그대로 props에 넘겨주는게 좋다.컴포넌트 배열의 중간에 삽입,삭제가 일어날 경우 index값이 올바르게 매칭 되지 않아 에러가 발생할 수 있다. useCallback은 부모 컴포넌트에서 자식 컴포넌트(Reac