mutation 의 경우 list addition/deletion 에 대한 커밋(updater)은 따로 구현해줘야 하지만 나머지 경우는 ID 가 잘 있으면 정상적으로 캐시를 업데이트 합니다. 뷰 일관성을 지키려면 업데이트 하고 싶은 정보를 뮤테이션 응답에 정확히 표현하는게 중요한데요. 그 때 component colocation 패턴이 유용합니다.

colocation 이란 컴포넌트와 컴포넌트가 의존하는 데이터 프래그먼트를 같이 배치하는 패턴으로 relay 에서는 fragment container 로 1st party 로 제공하는 패턴입니다.

const MyPosts = ({ me, posts }) => React.Element;

fragment MyPosts_me on Query { ... }
fragment MyPosts_posts on User {
  posts {
    # MyPosts 가 의존하는 데이터를 다시 명시
    ...PostCard_post
  }
}

이런식으로 colocation 을 사용하면 컴포넌트와 의존성 데이터의 컴포지션을 항상 일치시킬 수 있어서 “선언적 데이터 패칭” 이 가능합니다.

그러면 나머진 자연스럽게

mutation publishPost(...) {
  author {
    ...MyPosts_posts
  }
  post {
    ...PostCard_post
  }
}

요렇게 뮤테이션에 의해 실제로 변경을 전파하고 싶은 구성요소(컴포넌트, 데이터 의존성 모두 표현함)를 선언함으로써 자연스럽게 달성할 수 있습니다.

결론: 프래그먼트 쓰세요

구현 다 갈아엎는다고 패치도 늦ㄱㅎ