pile·
프론트엔드·핏펫핏펫·

Apollo Client 페이지네이션 fetching 가이드

문제기존 refetch 기반 페이지네이션은 비효율적이었고 데이터 총량이 기본 페이지 크기보다 작으면 리스트가 표시되지 않는 이슈가 있었다.
접근fetchMore API와 updateQuery 콜백으로 이전·신규 데이터를 병합하고, pageNumber가 1이면 fetchMore 호출을 건너뛰는 분기를 넣었다.
결과fetchPolicy를 cache-and-network로 두고 updateQuery에서 edges 배열을 스프레드로 병합하면 간결하고 안정적인 무한 스크롤이 동작함을 확인했다.
핏펫
핏펫 블로그
원문은 여기서 이어서 읽을 수 있어요
원문 읽기
읽음 (0)

이 글과 비슷한

  1. 프론트엔드·여기어때 (GC컴퍼니)여기어때 (GC컴퍼니)·

    항공 프론트엔드 구축기 (7/10): 창구를 하나만 두었습니다

    여기어때 항공 서비스 프론트엔드가 웹과 앱 웹뷰 두 환경에서 동일한 함수 호출로 동작하는 앱 브릿지 추상화 레이어를 설계한 과정을 다룬다. iOS·안드로이드 규약 차이와 "웹에 존재하지 않는 브릿지를 어떻게 호출하나"라는 문제를 단일 추상화 층으로 해결한 구현 사례다.

    요약 이어보기
    #react#typescript#webview+2