질문이 있습니다!

Question

안녕하세요 강사님! 아래와 같이 문제가 있어 질문 남깁니다! graphQL 적용 후 새로고침 시 화면 렌더링 속도가 되게 느려짐 => 어떤 문제인지 잘 모르겠습니다..  Create 후에 getData를 하지 못함(등록 버튼 누르고 새로 fetch를 해야 Create 했던 내용이 나옴)=> 기존에 MsgList 컴포넌트에서 GET_MESSAGES로 fetch 하였을 땐 잘 동작했지만 getServerSideProps함수 안에서 fetch 했더니 동작하지 않는 것 같습니다(추측) React Component Tool에 Hydrate 부분이 Anonymous라고 뜸 => React-query 버전이 올라가면서 문법상에 오류가 있는 건지, Hydrate(캐싱)이 적용 되지 않는 것 같습니다. ㅜㅜ 도와주세요!!!.. _app. js   index   MsgList(Create Code)

jaenam · Answer

graphQL 적용 후 새로고침 시 화면 렌더링 속도가 되게 느려짐 => 어떤 문제인지 잘 모르겠습니다.. 직접 코드를 함께 살펴보기 전에는 이부분은 저도 뭐라 말씀드릴 수가 없네요. Create 후에 getData를 하지 못함(등록 버튼 누르고 새로 fetch를 해야 Create 했던 내용이 나옴)=> 기존에 MsgList 컴포넌트에서 GET_MESSAGES로 fetch 하였을 땐 잘 동작했지만 getServerSideProps함수 안에서 fetch 했더니 동작하지 않는 것 같습니다(추측)  setQueriesData -> setQueryData 오타가 보입니다. React Component Tool에 Hydrate 부분이 Anonymous라고 뜸 => React-query 버전이 올라가면서 문법상에 오류가 있는 건지, Hydrate(캐싱)이 적용 되지 않는 것 같습니다. ㅜㅜ 강의 내에서 실질적으로 hydration을 적용하지 않아서 그렇습니다. 원래는 'dehydratedState'라는 props를 전달해주어야 해요.  https://tanstack.com/query/v4/docs/guides/ssr