리엑트 쿼리 버전 질문!

Question

안녕하세요 제로초님 리엑트쿼리 버전을 보면서 궁금한것이 있어 질문드립니다. 1. _app.tsx의 코드에서 const queryClientRef = useRef < QueryClient >(); if ( ! queryClientRef . current ) { queryClientRef . current = new QueryClient (); 리엑트쿼리 공식문서에선 useState를 사용하였고 제로초님 코드에서 Ref를 사용하였던데  ref 사용하신이유가 렌더링관련해서 더나은 이점이 있을거라 추측했는데 어떤건가요!? 2. getServerSideProps에서 리엑트쿼리로 비동기 값을 로드하고서 같은 쿼리키로 사용한 데이터를 콘솔로그 찍었을때 맨첨에 undefined로 찍혀서 질문드립니다. 제가 생각했을때는 서버에서 데이터를 로드하고서 쿼리키에 저장시키니까 코드를 사용하는 로직에서 같은 쿼리키의 데이터를 콘솔로그 찎으면 값이 채워져 있어야한다고 생각하는데 제가 코드를 잘못짠건지 아니면 이해를 잘못한건지 궁금합니다.  해당 데이터가 서버에서 로드됬는지 확인할수 있는 방법이 있을까요? 3.   props: {dehydratedState: JSON.parse(JSON.stringify(dehydrate(queryClient))), getServerSideProps의 로직에서 dehydrate(queryClient)를 JSON.parse(JSON.stringify)로 묶으신 이유가 무엇인지 궁금합니다    감사합니다

제로초(조현영) · Answer

1. 저도 공식문서 보고 했는데 공식문서가 업데이트된 것일 수도 있습니다. 근데 문제만 없다면 ref가 성능 더 좋은 것은 맞습니다. 2. 백엔드서버쪽에서 콘솔로 확인하셔야 할 겁니다. 3. 이것도 문서 따라한 것입니다. 추측으로는 쓸데없는 속성들 제거 + 불변성 유지하는 게 목적이었을 것 같습니다.