개인 프로젝트/Danmuji0421 트러블 슈팅: 데드락 문제 해결 계속 로딩화면만 나타나는 문제가 발생했다. useEffect(() => { const supabase = createClient(); // 모든 상태 초기화 함수들을 병렬로 실행하는 헬퍼 함수 const initializeAllStates = async (user: User | null) => { try { if (user) { // 사용자가 로그인한 경우 - 모든 상태 초기화 await Promise.all([ initializeBookmarks(), initializeParticipation(), initializeLectureBookmarks(), in.. 2025. 8. 28. GraphQL 도입 - 도서 추천 페이지, 도서 상세 페이지 최종 수정: 2025.08.16GraphQL 도입 - 도서 추천 페이지, 도서 상세 페이지A. 도서 추천 페이지 실제 API 요청 수 58.8% 개선: 17개 -> 10개로 감소전체 요청 수(리소스 포함) 12.3% 개선: 57개 -> 50개로 감소페이지 로딩 시간 22.2% 개선: 1.62s -> 1.26sN+1 쿼리 문제 해결: 수많은 개별 studies?select= 요청들이 GraphQL 에서는 단일 쿼리로 통합되었다. 즉, 도서 목록이 늘어날수록 더 큰 효과를 발휘할 것이다.# 이전: 각 도서마다 개별 요청studies?select=&book_id=eq.d60103-43cf-4883-... (168ms)studies?select=&book_id=eq.57c7c226-8bdc-4506-... (6.. 2025. 8. 20. GraphQL 도입 - 커뮤니티 상세 페이지, 커뮤니티 페이지 최종 수정: 2025.08.19GraphQL 도입- 커뮤니티 상세 페이지, 커뮤니티 페이지A. 커뮤니티 상세 페이지성능 개선 결과초기 로딩 시간: 1.80s -> 1.95s -> 2.68s (waterfall issue)네트워크 요청 67%개선: 33개 -> 9개 -> 11개데이터 전송량 59% 개선: 28.7kb -> 11.6kb Q, 초기 로딩 시간이 오히려 증가한 이유는?Waterfall 문제 발생: 순차 로딩// 문제가 된 코드 패턴const { data: postData } = useFetchPostQuery({ postId });const authorId = postData?.community_postsCollection?.edges?.[0]?.node?.author_id;// authorI.. 2025. 8. 18. GraphQL 도입 - 스터디 상세 페이지 + 실시간 채팅 최종 수정: 2025.08.16GraphQL 도입 - 스터디 상세 페이지 + 실시간 채팅개선 사항1. 정확한 데이터 페칭Before: 전체 테이블 데이터를 가져와서 필터링// 불필요한 필드들도 모두 가져옴const { data } = await supabase .from('study_participants') .select('*') // 모든 필드! After: 필요한 필드만 정확히 요청query FetchStudyParticipants($studyId: UUID!) { study_participantsCollection(filter: { study_id: { eq: $studyId } }) { edges { node { id user_name r.. 2025. 8. 16. 리팩토링에 따른 결과 최종 수정: 2025.08.20리팩토링 과정1. 코드 줄이기2. Jotai 적용3. TanStack Query 적용4. GraphQL 적용코드 줄이기컴포넌트 단위로 분리하여 재사용성을 높이기커스텀 훅 생성 (React - hooks폴더 / TanStack Query - hooks/api 폴더)공통 유틸리티 함수 생성결과1. 네트워크 횟수 감소 (관리자 로그인 유지) 기존 코드 -> Jotai 적용 -> TanStack Query 적용 -> GraphQL 적용강의 상세 페이지109회 -> 55회 -> 34회스터디 페이지44회 -> 34회 -> 10회 -> 8회스터디 상세 페이지64회 -> 45회 -> 9회 -> 7회도서 추천 상세 페이지61회 -> 55회 -> 31회 -> 7회코스 페이지34회 -> 25회.. 2025. 8. 9. 이전 1 2 3 4 5 다음 more
