GraphQL クライアント周りで知っておくと良さそうなこと
🏗工事中なので生暖かい目で見てください
GraphQL クライアントの選び方について
現状大きく次のような選択肢があります。
- Apollo Client
- Relay
- Urql
他に react-query や SWR などの GraphQL に特化していないものを使うこともできるらしいがあまりメリットがピンときていない
GraphQL クライアントにやってもらいたいこと
上記は Web の GraphQL クライアントの比較しか書いておらず、他のプラットフォーム(Flutter とか)でも選定軸が持てるように、もう少し "GraphQL クライアント" と呼ばれるものに何を期待しているのかを書き出してみる。
graphql リクエストを送れる
最低限の機能です。
エンドポイント、認証トークン は共通のものとして準備して、あとはクエリをのっけたらリクエストが作れたらいいでしょう。
キャッシュを保ってくれる
キャッシュの正規化ってなに?
ざっくり言うと同じモデルのもの(GraphQL では id と typename が一緒)は別々のクエリで更新されてもキャッシュが更新されるような形に保つことです。
要するに id と typename から一意にアクセスできるようにすることを指します
graphql-codegen から関数を生成できる
毎回自分で書いたクエリを読み込ませるのはめんどくさいため
graphql-codegen
GraphQL を使っていて、このツールを導入しないのは人権侵害に等しいです。
graphql-codegen は GraphQL のスキーマ & クエリから色々なものを生成してくれるツールです。
よく生成の対象となるのは次のようなものです。
- 型
- Query や Mutation を呼び出す関数
- (React & Apollo の場合)上記関数を useQuery で使える hooks
かなり手間が減らせるため導入しない理由がありません!
Colocation について
エラーハンドリングについて
これに関しては色んな宗派があります。まず前提として、GraphQL では基本的にステータスコードは常に 200 です。なので中身のエラーオブジェクトをどう定義するか色んな可能性がある訳です。
普通に data と error オブジェクトを分けて詰める宗派。
Result 型を定義して Union にする
ページネーションについて
Relay Cursor Connections という形が有名な方法です。
ただ、必ずしもこれに則る必要はなく、単純のオフセットベースのページネーションを選ぶのもよいでしょう。