인프런 커뮤니티 질문&답변

질문의 의도는 아래처럼 함수 인자로 userId를 전달하는 경우 인가요? 가능 합니다만 supabase auth를 이용하지는 못합니다.

const getUserInfo = useCallback(async (userId) => {
  const result = await supabase.(profile db 등).getUserById(userId);
  if (result?.data?.user) setUser(result?.data?.user);
}, [supabase]);

const getUserInfo = useCallback(async () => {
  const result = await supabase.auth.getUser();
  if (result?.data?.user) setUser(result?.data?.user);
}, [supabase, userId]);

위 처럼 userId가 의존성 배열에 들어가도 의미는 없습니다.

질문의 의도를 잘 모르겠네요. ㅠㅠ

의존성 배열은 특정 변수가 바뀌는것을 캐치 하느냐 안하느냐 판단하면 됩니다.

• 특정 변수가 바뀌는데 이를 캐치했다라면 변경된 최신의 변수와 함께 useCallback, useMemo등이 갱신됩니다.

• 그렇지 않다라면 예전의 낡은 변수, 인스턴스를 보고 있겠죠?

안녕하세요, 인프런 AI 인턴입니다. 웰시코기님.

useCallback의 디펜던시 배열에 supabase가 포함된 이유에 대해 설명드리겠습니다. useCallback은 리액트에서 함수의 메모이제이션을 위해 사용되는 훅입니다. 이는 주어진 의존성(dependency) 배열에 포함된 값들이 변경될 때마다 새로 함수를 생성합니다.

Supabase 의존성의 의미:

• 의존성 배열: useCallback의 의존성 배열은 함수가 다시 생성될 조건을 정의합니다. 배열 안의 값이 변경되면, 함수가 다시 생성됩니다.
  
• supabase 객체: supabase 클라이언트 객체가 변경될 가능성이 있을 때를 대비해 배열에 포함시킵니다. 일반적으로 이는 많이 발생하지 않습니다. 하지만 객체 참조가 변경되면 새로운 함수를 보장함으로써, 항상 최신의 supabase 인스턴스를 사용하는 안전성을 확보할 수 있습니다.
  

userId가 아닌 이유:

• userId 의존성: 만약 useCallback 함수 내부에서 userId 변수가 사용되었다면, 그리고 userId의 변경에 따라 함수가 재생성되기를 원한다면 의존성 배열에 포함해야 할 것입니다.
  
• 현재 코드에서는 사용되지 않음: useCallback 내부에서는 userId가 사용되지 않고 있기 때문에, 의존성 배열에 포함될 필요가 없습니다. 포함시키지 않음으로써 불필요한 함수 재생성을 피할 수 있습니다.
  

참고할 수 있는 유사한 질문:

• 서버 컴포넌트에서 API 호출 시 Supabase의 클라이언트/서버 클라이언트 차이점이 궁금합니다.
  
  • 이 질문에서 클라이언트와 서버 사이의 Supabase 인스턴스 사용 차이를 다루고 있으며, 의존성 배열 작성 시 고려해야 할 부분에 대한 힌트를 얻으실 수 있습니다.
    

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.