1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

GraphQL

Posted at

GraphQLによるWeb APIの課題解決アプローチ

序論

Web APIの設計・実装における技術として、長らくREST(Representational State Transfer)が主流であった。しかし、クライアントアプリケーションの多様化と複雑化に伴い、RESTの設計思想に起因するいくつかの課題が顕在化してきた。本稿では、それらの課題である「オーバーフェッチング」「アンダーフェッチング」、そして「N+1問題」を概説し、その解決策として注目されるクエリ言語「GraphQL」が、どのようなアプローチでこれらの課題に対応するのかを、具体例を交えて詳細に解説する。

GraphQLは、2012年に当時のFacebook社によって開発が開始され、2015年にオープンソース化されたWeb APIのためのクエリ言語および実行環境である。クライアントがAPIから取得するデータの構造を、リクエスト毎に柔軟に指定できる点を最大の特徴とする。現在ではGraphQL Foundationが開発コミュニティをサポートしており、RESTを補完または代替する技術として、その利用が広がりを見せている。

1. REST APIにおける課題

REST APIにおける課題は、その基本的な設計思想、すなわち「リソースごとにエンドポイントを固定する」という原則に起因する部分が大きい。以下に代表的な3つの課題を挙げる。

1.1. オーバーフェッチング(Over-fetching):データの過剰取得

オーバーフェッチングとは、APIから必要以上の情報、すなわち不要なデータフィールドまで含めて取得してしまう状況を指す。

具体例:
ユーザーの名前一覧のみを必要とする場面を想定する。RESTの設計では、/usersのようなエンドポイントにリクエストを送信することが一般的である。しかし、このエンドポイントは各ユーザーに関する全ての情報(ID、名前、住所、メールアドレス、生年月日など)を返すように設計されていることが多い。
/users のレスポンス例:


\[  
  {  
    "id": 1,  
    "name": "山田太郎",  --これだけ必要。 
    "email": "taro@example.com",  
    "address": "東京都...",  
    "birthdate": "1990-01-01"  
  }  
\]

※名前(name)だけが必要な場合でも、上記のように全ての情報が返却される。

デメリット:
この結果、クライアントは本来不要なデータを受け取ることになる。これは特にモバイル環境など通信帯域が限られる状況において、通信量を増大させ、アプリケーションの応答速度を低下させる要因となる。また、クライアント側のメモリを不必要に消費する結果にも繋がる。

1.2. アンダーフェッチング(Under-fetching):データの不足

アンダーフェッチングはオーバーフェッチングとは対照的に、一度のリクエストでは必要な情報が揃わず、複数のエンドポイントへ複数回のリクエストを送信しなければならない状況を指す。

具体例:
特定のブログ記事と、その記事に紐づくコメント一覧を同時に表示したい場合を考える。RESTでは、まず GET /posts/123 というリクエストで記事本文の情報を取得し、次にそのレスポンスに含まれる情報を用いて GET /posts/123/comments をリクエストし、コメント情報を取得するという段階的な手順を踏む必要がある。
デメリット:
リクエスト回数が増加するため、最終的に画面表示が完了するまでの待ち時間(レイテンシー)が長くなる。また、クライアント側で複数のリクエストを管理し、それらの結果を統合する処理が必要となるため、実装が複雑化する傾向にある。

1.3. N+1問題

N+1問題は、アンダーフェッチングの典型的な一例であり、特にパフォーマンスへの影響が大きい問題として知られる。これは、あるリソースのリストを取得するための1回のリクエストののち、そのリストに含まれる各要素(N個)の関連データを取得するために、追加でN回のリクエストが発生してしまう状況を指す。

具体例:
10件のブログ記事一覧と、各記事の作成者名を表示したい場合を考える。

  1. 最初の1回: GET /posts?limit=10 をリクエストし、10件の記事データを取得する。このレスポンスには、各記事の authorId が含まれる。
  2. 追加のN回 (10回): 取得した10件の記事データそれぞれについて、authorId を用いて GET /users/{authorId} というリクエストをループ処理で10回実行し、作成者名を取得する。

この結果、APIリクエストの総数は 1 + 10 = 11 回に達する。

デメリット:
APIサーバーへのリクエスト数がリストの件数に比例して増加するため、サーバー負荷とクライアントの待ち時間が大幅に増大する。データ量が増えるほど、この問題は深刻化する。

2. GraphQLによる課題解決のアプローチ

GraphQLは、前述したRESTの課題に対し、根本的に異なるアプローチを提供する。それは、「APIのデータ構造をスキーマとして定義し、クライアントがクエリを用いて必要なデータだけを問い合わせる」という考え方である。

大局的に見れば、GraphQLはデータベースに対する問い合わせ言語であるSQLと同様の位置付けと捉えることができる。SQLが表形式のデータを操作対象とするのに対し、GraphQLはプログラミング言語で一般的に扱われるオブジェクトグラフを対象とする。

2.1. スキーマとクエリ

GraphQLのアーキテクチャは、スキーマ(Schema)とクエリ(Queryという2つの中心的な概念によって構成される。

  • スキーマ (Schema): サーバーサイドで定義される、APIが提供可能なデータの構造や型、リレーションを記述した設計図である。どのようなデータが取得可能か、どのような操作が可能かを厳密に定義する。
  • クエリ (Query): クライアントサイドから送信される、要求するデータを具体的に記述した問い合わせ文である。クライアントはスキーマに定義された構造の中から、必要なフィールドを自由に選択してクエリを構築する。

レストランでの例を以下に示す。

  1. 【サーバーサイド】 スキーマ定義: レストランで言うところのメニューに該当する。メニューには「ステーキ(肉、付け合わせ、ソース)「サラダ(野菜、ドレッシング)といった料理と、その詳細が全て書かれている。これを見ることで、客(クライアント)はどんな注文が出来塚を正確に把握できる

2. 【クライアントサイド】 クエリ送信:クライアントは必要なものだけを要求すると言う点がGraphQLの最大の特徴。レストランで、「コース料理」を頼むのではなく、「アラカルトで好きなものを細かく注文する」感覚に似ている。RESTだったら、ラーメン屋さんのチャーハンを食べたいけど、チャーハンはラーメンとセットでしか、注文できない。このように、本来、必要じゃないけど、勝手についてきてしまう。感覚に似てる。だから、GraphQLを使うと、不要なもの(ラーメン)を受け取らずに済みます。

3. 【サーバーサイド】 データ解決と応答: クライアントは、届いたお皿を探し回る必要がなく、欲しいものが欲しい形で手に入るため、その後の処理が非常に楽になる。

3. 【具体例】TODOアプリケーションにおけるGraphQL

ここでは、TODOアプリケーションを例に、GraphQLの具体的な動作を解説します。

GraphQLを利用したアプリケーションの基本的な処理フローは以下の通りです。

  1. クライアントは、必要なデータを記述したクエリを単一のエンドポイント(例: /graphql)にPOSTメソッドで送信します。
  2. サーバーは受け取ったクエリを解析します。
  3. リゾルバと呼ばれる関数が、クエリの各フィールドに対応するデータをデータベース等から取得・加工します。
  4. サーバーは、リゾルバが返したデータを元に、クエリの構造と完全に一致したJSON形式で応答を作成し、クライアントに返します。

3.1. スキーマ定義の例

サーバーサイドでTODO項目を表すGraphQLスキーマ例

type TodoItem {  
  id: ID\!  
  todo: String\!  
  detail:String
  dealine:String
  status:Boolean!
}

ToDoリストに対するクエリ定義例

type Query {   
  todos: \[TodoItem\]
}

3.2. クエリの例

クライアントは、上記スキーマに基づき、以下のようなクエリを作成してサーバーに送信します。

例1:TODO項目を取得するGraphQLクエリ

query {  
  todos {  
    id
    todo
    dealine  
    status  
  }  
}

例1のTODO項目を取得するGraphQLクエリ結果

{  
  "data": {  
    "todos": [  
      {  
        "id":"123456",
        "todo": "GraphQLの学習",  
        "dealine": "2024-05-31" ,
        "status":"true"
      },  
      {  
        "id":"789012",
        "todo": "GRPCの学習",  
        "dealine": "2024-07-31" ,
        "status":"true"

      },
      {
        "id":"345678",
        "todo": "REST APIの学習",  
        "dealine": "2024-08-31" ,
        "status":"true"
      } 
  }  
}

このクエリをGraphQLのエンドポイントへPOSTリクエストで送信することで、必要な情報を一回で取得することができる。上記の例1に対するレスポンスでは、クエリにdetailを追加すれば、ToDoの詳細情報を返すことができ、クライアントが必要とする情報を過不足なく返すことができる。これによって、オーバーフェッチングやアンダーフェッチングの問題を解決できる。

4. REST APIとGraphQLの比較

RESTとGraphQLは、APIを構築するためのアプローチにおいて、いくつかの根本的な違いを持ちます。

項目 REST GraphQL
エンドポイント 複数(リソース毎に /users, /posts など) 原則として単一(例: /graphql)
リソースの表現 URLパスでリソースを特定 スキーマとクエリでリソースとデータ構造を表現
データ取得 サーバーが定義した固定のデータ構造 クライアントが必要なフィールドをリクエスト毎に指定
HTTPメソッド GET, POST, PUT, DELETE などを意味に応じて使用 データ取得も更新も主に POST を使用
バージョン管理 URLにバージョン情報を含めることが多い(例: /v2/users) スキーマにフィールドを追加することで後方互換性を保ちやすい
代表的な課題 オーバー/アンダーフェッチング, N+1問題 クエリの複雑化、キャッシュ戦略の複雑さ

特筆すべきはHTTPメソッドの利用方法である。RESTがリソース操作の意図をHTTPメソッド(GET: 取得, POST: 作成など)で表現するのに対し、GraphQLはクエリ自体が操作の意図を内包するため、主にPOSTメソッドを通信の窓口として利用する。これは、複雑なクエリがURLの長さ制限を超える可能性があり、リクエストボディにクエリを格納する必要があるための処置である。この点において、GraphQLはSOAPのようなRPC(Remote Procedure Call)に近い性質を持つと言える。

5. GraphQLのサーバーサイド実装に関する補足

GraphQLは、クライアントとサーバー間の問い合わせに関する取り決め(仕様)であり、それ自体が特定のデータベースやストレージエンジンに依存するものではない。GraphQLのエンドポイントを提供するサーバー側の開発者は、スキーマを定義するとともに、各フィールドのデータをどのように取得するかという具体的な処理(リゾルバ)を実装する必要がある。この実装には、各種プログラミング言語で提供されているGraphQL用のライブラリや自動生成ツールが活用されることが多い。

結論

GraphQLは、クライアントサイドがAPIから取得するデータの主導権を握ることを可能にする、強力なパラダイムを提供する。必要なデータを過不足なく一度のリクエストで取得できるという特性は、REST APIが直面していたオーバーフェッチング、アンダーフェッチング、そしてN+1問題に対する明確な解決策となる。

これにより、サーバーとクライアント間の通信効率を最適化し、アプリケーションのパフォーマンスを向上させることができる。また、サーバーはクライアントの多様な要求に柔軟に応える単一のエンドポイントを提供するだけでよくなり、APIの管理と進化を容易にする。Web API開発において、GraphQLはRESTと並び立つ、重要な技術的選択肢の一つであると言えよう。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?