React10 React memo React memo 리액트에서 제공하는 고차 컴포넌트(Higher Order Component)이다. 고차 컴포넌트는 어떤 컴포넌트를 인자로 받아서 새로운 컴포넌트를 반환하는 함수이며, React memo는 렌더링이 되어야 할 상황에 놓일 때마다 Props Check를 통해서 자신이 받는 Props에 변화가 있는지 확인을 하고 변화가 있다면 리렌더링을 하고, 변화가 없다면 기존에 렌더링이 된 내용을 재사용한다. React memo는 Props를 기반으로 구성요소만 memoization 하기 때문에 컴포넌트 내에서 useEffect, useState와 같은 훅을 사용하는 경우 변경 여부에 관계없이 컴포넌트가 리렌더링이 된다. 주의할 점은 부모 컴포넌트에서 객체를 자식 컴포넌트에게 Props로 전달할 때 R.. 2023. 11. 20. React-Query (Cache-time, Stale-time) Cache-time, Stale-time 나는 처음에 리액트 쿼리가 서버에 첫 번째 요청 이후 응답 값을 데이터를 캐시에 저장하는데, 만약 같은 요청을 다시 하고, 응답 값이 캐시에 저장되어 있다면 서버에 요청을 보내지 않고 캐시에 저장된 데이터를 불러오는 라이브러리인 줄 알았다. 근데 이 부분은 조금 틀렸다는 사실을 얼마 전에 알게 되었다. 리액트 쿼리의 Cache-time, Stale-time의 기본 설정은 Cache-time이 5분, Stale-time은 0초이다. 이는 캐시에 데이터가 5분간 저장된다는 것을 의미하는데, 저장된다고 해서 같은 데이터를 요청했을 때 서버에 요청을 보내지 않는 것은 아니었다. 이유는 Stale-time이 0초이기 때문인데, 이는 캐시에 저장된 데이터가 신선하다고 판단하.. 2023. 11. 2. 이전 1 2 3 다음 728x90
