Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Persisted-queryをやってみた

indigolain
August 28, 2020

 Persisted-queryをやってみた

GraphQL Tokyo #10 発表資料

indigolain

August 28, 2020
Tweet

More Decks by indigolain

Other Decks in Technology

Transcript

  1. Persisted-queryをやってみた
    @indigolain

    View full-size slide

  2. Who am I?
    ● indigolain / 上原拓也
    ● Rails / React / GraphQL
    ● 最近個人プロジェクトでUnityで3Dサウンドを使ったゲーム
    を作ろうと試行錯誤しています

    View full-size slide

  3. Automatic Persisted Queries
    ● Apolloが提供しているPersisted Queryの仕組み
    ● リクエストを小さくする、もしくはcacheを使うことを目的としたもの
    ○ 望まないクエリの排除などの機能はない
    ● apollo-server, apollo-clientなどapolloなライブラリを組み合わせると
    ある程度動くものがさらっとできます

    View full-size slide

  4. Automatic Persisted Queries
    https://www.apollographql.com/docs/apollo-server/performance/apq/

    View full-size slide

  5. Automatic Persisted Queries
    https://www.apollographql.com/docs/apollo-server/performance/apq/

    View full-size slide

  6. Automatic Persisted Queries
    https://www.apollographql.com/docs/apollo-server/performance/apq/

    View full-size slide

  7. Automatic Persisted Queries
    https://www.apollographql.com/docs/apollo-server/performance/apq/

    View full-size slide

  8. Automatic Persisted Queries
    https://www.apollographql.com/docs/apollo-server/performance/apq/

    View full-size slide

  9. Automatic Persisted Queries
    https://www.apollographql.com/docs/apollo-server/performance/apq/

    View full-size slide

  10. すごい、便利

    View full-size slide

  11. でも・・・
    ● 登録されているクエリ-ハッシュのペアをコードで管理したい
    ● 登録されるクエリ-ハッシュのペアをレビューできるようにして、どのような
    クエリが呼ばれる可能性があるのか把握したい
    リクエストされるクエリを把握し、
    新しく送られるクエリについてPRなどで議論できるようにしたい

    View full-size slide

  12. でも・・・
    クライアントのコードから
    クエリ-ハッシュがペアになっている
    JSONを自動生成できるようになれば
    コード化 && レビュー
    できるのでは
    ● 登録されているクエリ-ハッシュのペアをコードで管理したい
    ● 登録されるクエリ-ハッシュのペアをレビューできるようにして、どのような
    クエリが呼ばれる可能性があるのか把握したい

    View full-size slide

  13. {
    "version": 2,
    "operations": [
    {
    "signature": "e5f…...",
    "document": "query UpdateQuery….",
    "metadata": {
    "engineSignature": ""
    }
    },
    …..
    ]
    }
    query UpdateQuery($courseId: ID!) {
    updateQuery(id: $id) {
    …...
    }
    }
    Query JSON
    apollo client:extract https://github.com/apollographql/apollo-tooling#apollo-clientextract-output
    query UpdateQuery2($courseId: ID!) {
    updateQuery2(id: $id) {
    …...
    }
    }
    JSON生成
    &
    PR化

    View full-size slide

  14. JSONを参照して
    hash → クエリする処理
    https://www.apollographql.com/docs/apollo-server/performance/apq/

    View full-size slide

  15. TODO
    ● 生成したJSONの管理の仕方
    ○ NativeアプリのバージョンによってJSONを分離する?
    ○ Nativeクライアントの種類によってJSONを分離する?
    ● etc….
    話したこと
    ● ApolloのAutomatic Persisted Queriesの仕組みを活用しつつ、
    persistするクエリをJSONで自由に登録できるようにした
    ● JSONで発行されるクエリをコード化することによって、クライアントから呼
    ばれるクエリをレビューするための仕組みができた

    View full-size slide