apollo clientのcacheに有効期限をつける

はじめに

Apollo Client ver3.0では新たにcacheについていくつか機能が追加されています。その一つがcacheの削除です。
cacheに有効期限を設ける方法について、考えたので備忘録として残します（もっといい方法があれば教えてください）

evictとgc

今回は Apollo Client ver3.0で新しく追加されたgcとevictを使います。詳しい説明は公式docを参照してください

evict

evictはcacheに保存されているdataを消すことができます。
使う際は__typenameとidをセットにして使います

cache.evict('__typename:id')

gc

gcはevictで特定のdataを消した後cacheに残っているゴミを消すことができます。
ここでいう今回消したdataをrefとして持つ親データです。子を消した事によって、親が参照するdataがなくなりますが、gcを使う事によってこういったゴミを消すことができ、cacheのdataがクリーンに保たれます。

cache.gc()

実装例

以前挙げたQiitaの記事のQueryで保存されたcacheに有効期限10分をを設定したコードです。（apollo clientの中に有効期限設定できる機能があるのかも?）

import { ApolloClient, HttpLink, InMemoryCache } from "@apollo/client";

const link = new HttpLink({
  uri: "http://localhost:4000/graphql"
});

const cache = new InMemoryCache()

const cacheInterval = setInterval(() => {
  cache.evict('Comment:1');
  cache.gc();
}, 10 * 60 * 1000);

const client = new ApolloClient({
  link,
  cache,
  defaultOptions: {
    watchQuery: {
      fetchPolicy: "cache-first"
    }
  }
});