Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
GraphQLクライアントの技術選定 2023冬
Search
KazukiHayase
November 17, 2023
Technology
9
7.2k
GraphQLクライアントの技術選定 2023冬
KazukiHayase
November 17, 2023
Tweet
Share
More Decks by KazukiHayase
See All by KazukiHayase
CIでのgolangci-lintの実行を約90%削減した話
kazukihayase
0
470
もし今からGraphQLを採用するなら
kazukihayase
13
5.4k
Goでテストをしやすくするためにやったこと
kazukihayase
1
830
Introduction and Insights of the Hasura-based Architecture
kazukihayase
0
1k
自分だけが頑張るのをやめて、フルスタックなチームを作る
kazukihayase
2
3.3k
Goでテンプレートからファイルを自動生成するCLIを作る
kazukihayase
0
1.4k
生産性が上がり続けるチームを作るための第一歩
kazukihayase
4
3.8k
GraphQLにおけるクライアントキャッシュ戦略
kazukihayase
0
3.3k
MUIをベースにしたデザインシステムの構築
kazukihayase
0
610
Other Decks in Technology
See All in Technology
ライブサービスゲームQAのパフォーマンス検証による品質改善の取り組み
gree_tech
PRO
0
540
AIのグローバルトレンド2025 #scrummikawa / global ai trend
kyonmm
PRO
1
230
kubellが考える戦略と実行を繋ぐ活用ファーストのデータ分析基盤
kubell_hr
0
140
機械学習を扱うプラットフォーム開発と運用事例
lycorptech_jp
PRO
0
130
2025年になってもまだMySQLが好き
yoku0825
8
4k
Agile PBL at New Grads Trainings
kawaguti
PRO
1
260
「魔法少女まどか☆マギカ Magia Exedra」のグローバル展開を支える、開発チームと翻訳チームの「意識しない協創」を実現するローカライズシステム
gree_tech
PRO
0
540
AI エージェントとはそもそも何か? - 技術背景から Amazon Bedrock AgentCore での実装まで- / AI Agent Unicorn Day 2025
hariby
4
1.1k
【5分でわかる】セーフィー エンジニア向け会社紹介
safie_recruit
0
30k
バッチ処理で悩むバックエンドエンジニアに捧げるAWS Glue入門
diggymo
3
110
大「個人開発サービス」時代に僕たちはどう生きるか
sotarok
19
8.9k
絶対に失敗できないキャンペーンページの高速かつ安全な開発、WINTICKET × microCMS の開発事例
microcms
0
390
Featured
See All Featured
The Art of Programming - Codeland 2020
erikaheidi
55
13k
Become a Pro
speakerdeck
PRO
29
5.5k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Being A Developer After 40
akosma
90
590k
Six Lessons from altMBA
skipperchong
28
4k
Scaling GitHub
holman
463
140k
Building Applications with DynamoDB
mza
96
6.6k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6k
Mobile First: as difficult as doing things right
swwweet
224
9.9k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
2.9k
Transcript
GraphQLΫϥΠΞϯτͷٕज़બఆ 2023ౙ ϑϩϯτΤϯυΧϯϑΝϨϯεԭೄ2023 2023.11.18
ૣًʢ@KazukiHayaseʣ • 2021BuySell Technologies৽ଔೖࣾ • ग़ཧSaaSνʔϜ ϓϩδΣΫτϦʔμʔ • Go /
TypeScript / GraphQL / ։ൃੜ࢈ੑվળ
None
None
• GraphQLΫϥΠΞϯτͷٕज़બఆͷ؍ • GraphQLΫϥΠΞϯτͷհͱൺֱ ͢͜ͱ • GraphQLʹ͍ͭͯͷৄ͍͠આ໌ ͞ͳ͍͜ͱ
ΞδΣϯμ GraphQLʹ͍ͭͯ 01 ٕज़બఆͷ؍ 02 GraphQLΫϥΠΞϯτͷൺֱ 03 ۩ମతͳબఆࣄྫ 04
01 GraphQLʹ͍ͭͯ
• Meta͕։ൃͨ͠Web APIͷن֨ • APIͷ༷ΛεΩʔϚͰఆٛ • ΫϥΠΞϯτ͕ඞཁͳσʔλߏΛࢦఆͯ͠औಘՄೳ GraphQLͱ
• ॊೈͳσʔλϑΣον • ܕ͚͞ΕͨεΩʔϚ • ڧྗͳΤίγεςϜ • Fragment Colocation GraphQLͷϝϦοτ
• ॊೈͳσʔλϑΣον • ܕ͚͞ΕͨεΩʔϚ • ڧྗͳΤίγεςϜ • Fragment Colocation GraphQLͷϝϦοτ
ॊೈͳσʔλϑΣον
ॊೈͳσʔλϑΣον ඞཁͳσʔλͷΈΛ୯ҰͷϦΫΤετͰऔಘՄೳ ΦʔόʔϑΣον/ΞϯμʔϑΣονͷࢭ ϞόΠϧͳͲͷωοτϫʔΫͰߴʹಈ࡞
• ॊೈͳσʔλϑΣον • ܕ͚͞ΕͨεΩʔϚ • ڧྗͳΤίγεςϜ • Fragment Colocation GraphQLͷϝϦοτ
• υΩϡϝϯτͱ࣮ʹဃ͕ੜ·Εͳ͍ • εΩʔϚϑΝʔετͳ։ൃ • εΩʔϚΛݩʹͨ͠ίʔυͷࣗಈੜ ܕ͚͞ΕͨεΩʔϚ
• ॊೈͳσʔλϑΣον • ܕ͚͞ΕͨεΩʔϚ • ڧྗͳΤίγεςϜ • Fragment Colocation GraphQLͷϝϦοτ
• The GuildΛத৺ͱͨ͠ڧྗͳΤίγεςϜ • e.g. GraphQL Code Generator, GraphQL Mesh,
GraphQL ESLint ڧྗͳΤίγεςϜ
• ֤छGraphQLΫϥΠΞϯτΤίγεςϜͷॏཁͳཁૉ • ΩϟογϡػߏͳͲʹΑΓΠϯϑϥΛҰͰ͖Δ ڧྗͳΤίγεςϜ Apollo Client & Client-side Architecture
Basics
• ॊೈͳσʔλϑΣον • ܕ͚͞ΕͨεΩʔϚ • ڧྗͳΤίγεςϜ • Fragment Colocation GraphQLͷϝϦοτ
ίϯϙʔωϯτͷσʔλཁ݅Λ ίϯϙʔωϯτͷଆʹFragmentͰఆٛ͢Δઃܭࢥ Fragment Colocationͱ
Fragment Colocationͱ FragmentͱίϯϙʔωϯτΛಉҰϑΝΠϧʹఆٛ
Fragment Colocationͱ ίϯϙʔωϯτͱGraphQLͷ֊ߏ͕Ұக
σʔλཁ֤݅ίϯϙʔωϯτͰఆٛͭͭ͠ σʔλऔಘ୯ҰͷQueryʢϦΫΤετʣͰߦ͑Δ Fragment ColocationʹΑΔϝϦοτ
• ΦʔόʔϑΣονʹؾ͖͍ͮ͢ • मਖ਼࣌ͷӨڹൣғ͕ίϯϙʔωϯτʹด͍ͯ͡Δ • ߴڽूɾૄ݁߹ͳͷͰνʔϜλεΫΛׂ͍͢͠ Fragment ColocationʹΑΔϝϦοτ GraphQLͷϝϦοτΛ࠷େԽ͢ΔʹɺFragment Colocation͕ඞཁ
1. ίϯϙʔωϯτπϦʔશମͰඞཁͳσʔλΛ1ͭͷQueryͰఆٛ a. Queryมߋ࣌ͷӨڹൣғ͕͍ b. ࢠίϯϙʔωϯτͷमਖ਼͕ίϯϙʔωϯτʹӨڹ 2. ֤ίϯϙʔωϯτͰσʔλऔಘΛ࣮ߦ a. ΥʔλʔϑΥʔϧͷൃੜ
Fragment ColocationΛߦΘͳ͍߹
• The GuildFragment Colocationਪ͍ͯ͠Δ ◦ Unleash the power of Fragments
with GraphQL Codegen • GraphQL Code Generatorͷclient preset ◦ Fragment Masking͕σϑΥϧτͰ༗ޮ ◦ Fragment ColocationΛڧ੍͞ΕΔ ΤίγεςϜͷํੑ
React Server Componentsͷ಄ʹΑΔGraphQLͷඞཁੑ
RSCΛ͏͜ͱͰAPIϦΫΤετ͕αʔόʔͰ࣮ߦ͞Ε ΥʔλʔϑΥʔϧͷӨڹ͕গͳ͘ͳΔ React Server Componentsͷ಄ʹΑΔGraphQLͷඞཁੑ ֤ίϯϙʔωϯτͰAPIϦΫΤετΛߦ͏͜ͱͰ ֤ίϯϙʔωϯτͰσʔλཁ݅ͷఆٛͱऔಘͷ྆ํ͕ՄೳʹͳΔ
RSCͱGraphQLͷڞ௨ • ແବͳσʔλసૹͷݮʹΑΔύϑΥʔϚϯεͷ্ • ඇಉظσʔλసૹʹUXͷվળ ◦ GraphQLͷ@deferσΟϨΫςΟϒ ◦ RSCͷஈ֊తͳετϦʔϛϯά
ύϑΥʔϚϯεͱUXͷ؍ʹ͓͍ͯ GraphQL͕RSCͰஔ͖͑ΒΕΔϢʔεέʔεଘࡏ͢Δ
GraphQL͕༗ޮͳ໘ • SPAͷ߹ ◦ APIϦΫΤετΫϥΠΞϯτ͔Β࣮ߦ • RSCΑΓGraphQLͷํ͕ίεύ͕ྑ͍߹ ◦ RSCಋೖͷΠϯϑϥɾӡ༻ɾֶशίετߴ͍
02 ٕज़બఆͷ؍
• 📍 Fragment Colocation • ⚡ ܕͷࣗಈੜ • 🔨 Ωϟογϡػߏ
• 📝 ֶशίετ ٕज़બఆͷ؍
ύϑΥʔϚϯεͱ։ൃऀମݧͷ؍Ͱඞཁ ؍ • Fragment Colocationͷ࣮ͷ͢͠͞ • Fragment Colocationʹ͓͚ΔύϑΥʔϚϯεͷ࠷దԽ 📍 Fragment
Colocation
ܕ҆શੑͱҰ؏ੑͷ୲อʹඞཁ ؍ • Query/Mutation/Fragmentͷܕͷࣗಈੜ͕Ͱ͖Δ͔ ⚡ ܕͷࣗಈੜ
ωοτϫʔΫϦΫΤετͷ࠷దԽͷͨΊʹඞཁ ؍ • Ωϟογϡػߏͷ༗ແ • ΩϟογϡػߏͷΈ • Ωϟογϡͷѻ͍͢͞ 🔨 Ωϟογϡػߏ
։ൃੜ࢈ੑ্ͷͨΊʹඞཁ ؍ • ϥΠϒϥϦͷѻ͍͢͞ • υΩϡϝϯτใྔͷॆ࣮ੑ • ίϛϡχςΟͷ׆ൃ͞ 📝 ֶशίετ
03 GraphQLΫϥΠΞϯτͷൺֱ
• Relay • Apollo Client • urql • graphql-request GraphQLΫϥΠΞϯτͷൺֱ
GraphQLΫϥΠΞϯτͷൺֱ Relay Apollo Client urql graphql-request Fragment Colocation 🟢 🟡
🟡 🟡 ܕͷࣗಈੜ 🟢 🟢 🟢 🟢 Ωϟογϡػߏ 🟢 🟡 🟡 🔴 ֶशίετ 🔴 🟡 🟢 🟢
• Relay • Apollo Client • urql • graphql-request GraphQLΫϥΠΞϯτͷൺֱ
• ։ൃݩɿMeta • GitHub Starɿ18kʢ2023/11/12࣌ʣ • ࠾༻ࣄྫɿFacebookɺAtlassian Relay
• Relayͷࢥͱͯ͠Fragment ColocationΛॏཁࢹ • ࣗવͱFragment Colocationʹ४ڌ࣮ͨ͠ʹͳΔ ◦ Relay CompilerʹΑΔ࠷దͳQueryͷੜ ◦
Data MaskingʹΑΔσʔλͷΞΫηε੍ޚ ◦ Fragment scopedͳม 📍 Fragment Colocation - Relay
📍 Fragment Colocation - Relay Data MaskingʹΑΓఆٛͯ͠ͳ͍σʔλʹΞΫηεͰ͖ͳ͍
• ίϯύΠϥʢRelay CompilerʣΛแ • Relay Compiler͕TypeScriptʢ͘͠FlowʣͷܕΛࣗಈੜ ⚡ ܕͷࣗಈੜ - Relay
• σʔλΛਖ਼نԽͯ͠อ࣋͢ΔΩϟογϡػߏΛ࣋ͭ • Global Object IdentificationʹΑΔσʔλͷਖ਼نԽ ◦ άϩʔόϧʹҰҙͳIDΛఆ ◦ ͜ΕʹΑΓϦϑΣονΩϟογϡͷߋ৽͕࠷దԽ͞ΕΔ
🔨 Ωϟογϡػߏ - Relay
Ωϟογϡ͕ར༻͞ΕΔ߹ͷྫ • ಉ͡Queryͷ߹ • ҟͳΔQueryͰཁٻσʔλ͕Ωϟογϡʹଘࡏ͢Δ߹ 🔨 Ωϟογϡػߏ - Relay
• Ωϟογϡͷߋ৽Λݕͯ͠ίϯϙʔωϯτΛ࠶ϨϯμϦϯά • ࠶ϨϯμϦϯά࠷దԽ͞ΕΔ ◦ ֤ίϯϙʔωϯτͰఆٛͨ͠σʔλʹߋ৽͕͋ͬͨ߹ͷΈൃՐ ◦ πϦʔશମ͕࠶ϨϯμϦϯά͞ΕΔ͜ͱ͕ͳ͍ 🔨 Ωϟογϡػߏ
- Relay
• ߴ͍ • ಛʹຊޠͷใ͕গͳ͍ • GraphQLʹରͯ͠ͷशख़͕ٻΊΒΕΔ • ഁյతมߋ͕ଟ͍ͷͰै͕ඞཁ 📝 ֶशίετ
- Relay
• Meta͕։ൃ͍ͯ͠ΔͷͰReactͱͷ૬ੑ͕͍͍ ◦ React18ͷSuspenseͳͲਅͬઌʹରԠ͞Εͨ • Relay CompilerʹΑΔGraphQLͷ໋໊نଇͷڧ੍ • શମతʹGraphQLͷ༷ʹ४ڌ ͦͷଞͷಛ
- Relay
• Relay • Apollo Client • urql • graphql-request GraphQLΫϥΠΞϯτͷൺֱ
• ։ൃݩɿApollo Graph Inc. • GitHub Starɿ19kʢ2023/11/12࣌ʣ • ࠾༻ࣄྫɿMediumɺCircleCI Apollo
Client
• Apollo Client୯ମͰ͍͠ ◦ v3.8͔ΒuseFragment͕Stableʹͳ͕ͬͨɺॾʑͷػೳ͕Γͳ͍ҹ • GraphQL Code GeneratorΛซ༻͢Δ͜ͱͰ࣮ݱՄೳ ◦
client presetͷFragment MaskingʹΑΔσʔλͷΞΫηε੍ޚ ◦ ≒ RelayͷDataMasking 📍 Fragment Colocation - Apollo Client
📍 Fragment Colocation - Apollo Client
📍 Fragment Colocation - Apollo Client
• GraphQL Code GeneratorΛซ༻͢Δ͜ͱͰ࣮ݱՄೳ • TypedDocumentNodeʹΑΔܕਪ ◦ ܕ͚͞ΕͨDocumentNodeΦϒδΣΫτΛ࡞͢ΔͨΊͷ։ൃπʔϧ ◦ Apollo
ClientҎ֎ͷϥΠϒϥϦͰ༻Մೳ ⚡ ܕͷࣗಈੜ - Apollo Client
• σʔλΛਖ਼نԽͯ͠อ࣋͢ΔΩϟογϡػߏΛ࣋ͭ • ҰҙͳࣝผࢠͷੜʹΑΔσʔλͷਖ਼نԽ ◦ idͱ__typenameΛ݁߹ͨ͠Ωϟογϡ༻ͷࣝผࢠΛੜ 🔨 Ωϟογϡػߏ - Apollo
Client
Ωϟογϡ͕ར༻͞ΕΔ߹ͷྫ • ಉ͡Queryͷ߹ • ҟͳΔQueryͰཁٻσʔλ͕Ωϟογϡ͕ଘࡏ͢Δ߹ 🔨 Ωϟογϡػߏ - Apollo Client
• Ωϟογϡͷߋ৽Λݕͯ͠ίϯϙʔωϯτΛ࠶ϨϯμϦϯά • QueryΛ࣮ߦ͍ͯ͠Δίϯϙʔωϯτ͕࠶ϨϯμϦϯά͞ΕΔ ◦ Relayͱҧ͍πϦʔશମ͕࠶ϨϯμϦϯά͞ΕΔ 🔨 Ωϟογϡػߏ - Apollo
Client
• ී௨ • ίϛϡχςΟ͕׆ൃ • ຊޠͷใ͕ॆ࣮͍ͯ͠Δ • ใ͕๛ͳ໘ɺػೳଟ͍ 📝 ֶशίετ
- Apollo Client
• Apollo LinkͳͲͷपลϥΠϒϥϦ͕ॆ࣮͍ͯ͠Δ • Relayurqlͱൺͯ։ൃ͕Ε͍ͯΔ ◦ e.g. React18ͷSuspenseͷରԠ͕ະྃʢ2023/11/12࣌ʣ ͦͷଞͷಛ -
Apollo Client
• Relay • Apollo Client • urql • graphql-request GraphQLΫϥΠΞϯτͷൺֱ
• ։ൃݩɿFormidable • GitHub Starɿ8.2kʢ2023/11/12࣌ʣ • ࠾༻ࣄྫɿGitHubɺTripadvisor urql
• Apollo Clientͱಉ༷ • GraphQL Code GeneratorΛซ༻͢Δ͜ͱͰ࣮ݱՄೳ 📍 Fragment Colocation
- urql
• Apollo Clientͱಉ༷ • GraphQL Code GeneratorΛซ༻͢Δ͜ͱͰ࣮ݱՄೳ ⚡ ܕͷࣗಈੜ -
urql
• Document CacheͱݺΕΔΩϟογϡػߏΛ࣋ͭ • QueryͱVariablesͷΈ߹Θͤ͝ͱʹΩϟογϡΛอ࣋ 🔨 Ωϟογϡػߏ - urql
Ωϟογϡ͕ར༻͞ΕΔ߹ͷྫ • ಉ͡Queryͷ߹ 🔨 Ωϟογϡػߏ - urql
• Apollo Clientͱಉ༷ • Ωϟογϡͷߋ৽Λݕͯ͠ίϯϙʔωϯτΛ࠶ϨϯμϦϯά • QueryΛ࣮ߦ͍ͯ͠Δίϯϙʔωϯτ͕࠶ϨϯμϦϯά͞ΕΔ ◦ Relayͱҧ͍πϦʔશମ͕࠶ϨϯμϦϯά͞ΕΔ 🔨
Ωϟογϡػߏ - urql
• ਖ਼نԽ͞ΕͨΩϟογϡΛར༻͢Δ͜ͱՄೳ • ਖ਼نԽͷϩδοΫApollo Clientͱಉ༷ 🔨 Ωϟογϡػߏ - urql
• ͍ • ػೳ͕γϯϓϧͳͨΊɺΩϟονΞοϓ͕༰қ 📝 ֶशίετ - urql
• όϯυϧαΠζ͕খ͍͞ • ExchangeʹΑΔ֦ு͕Մೳ ◦ ≒ GraphQLͷϦΫΤετ/ϨεϙϯεΛॲཧ͢ΔͨΊͷϛυϧΣΞ ͦͷଞͷಛ - urql
• Relay • Apollo Client • urql • graphql-request GraphQLΫϥΠΞϯτͷൺֱ
• ։ൃݩɿJason Kuhrtࢯ • GitHub Starɿ5.5kʢ2023/11/12࣌ʣ • ࠾༻ࣄྫɿஶ໊ͳاۀͰͳ͠ graphql-request
• Apollo Clientͱಉ༷ • GraphQL Code GeneratorΛซ༻͢Δ͜ͱͰ࣮ݱՄೳ 📍 Fragment Colocation
- graphql-request
• Apollo Clientͱಉ༷ • GraphQL Code GeneratorΛซ༻͢Δ͜ͱͰ࣮ݱՄೳ ⚡ ܕͷࣗಈੜ -
graphql-request
• ࣋ͨͳ͍ 🔨 Ωϟογϡػߏ - graphql-request
• ۃΊ͍ͯ • ࠷ݶͷػೳ͔͠උ͍͑ͯͳ͍ 📝 ֶशίετ - graphql-request
• ඇৗʹγϯϓϧͰܰྔ ͦͷଞͷಛ - graphql-request
GraphQLΫϥΠΞϯτͷൺֱ Relay Apollo Client urql graphql-request Fragment Colocation 🟢 🟡
🟡 🟡 ܕͷࣗಈੜ 🟢 🟢 🟢 🟢 Ωϟογϡػߏ 🟢 🟡 🟡 🔴 ֶशίετ 🔴 🟡 🟢 🟢
• Ωϟογϡػߏ͕ෆཁͳΒgraphql-request • Ωϟογϡػߏ͕ඞཁͳΒRelay or Apollo Client or urql ͲΕΛ࠾༻͢Ε͍͍͔ʁ
• ୈҰީิͱͯ͠Relay • ࣍ͰApollo Client or urql Ωϟογϡػߏ͕ඞཁͳ߹
ͳ͔ͥʁ
GraphQLಋೖͷҰ൪ͷత ωοτϫʔΫτϥϑΟοΫͷ࠷దԽʹΑΔύϑΥʔϚϯεͱUXͷ্
• Fragment Colocationͷ࠾༻͕ඞਢ • ͦͷࢥʹैͬͯ࠷దԽ͞Ε͍ͯΔͷݱঢ়ͰRelayͷΈ • ֶशίετߴ͍͕ɺͦΕʹݟ߹͏Ϧλʔϯେ͍ʹ͋Δ ωοτϫʔΫτϥϑΟοΫͷ࠷దԽʹ͓͍ͯ
• Apollo ClientͰ͍͍ͨػೳ͕ͳ͍ͳΒurql ◦ ࣮ݱ͍ͨ͜͠ͱʹରͯ͠Apollo ClientΦʔόʔͳέʔε͕ଟ͍ ◦ େମͷϢʔεέʔεurqlΧόʔͰ͖Δ • Apollo
Clientͷෳࡶ͞ނͷ͋Δ ◦ όʔδϣϯΞοϓʹ͏ΩϟογϡपΓσάϨ ◦ ReactͷैͷΕ Apollo Client ͱ urql
04 ۩ମతͳબఆࣄྫ
۩ମతͳબఆࣄྫ ग़ཧSaaSνʔϜͰApollo ClientΛ࠾༻
• ϓϩμΫτͷཁ݅తʹΩϟογϡػߏඞཁ • GraphQLࣗମ͕ॳΊͯͩͬͨͷ͋Γಋೖͷ͢͠͞Λ༏ઌ • ࣌࠾༻ࣄྫগͳ͔ͬͨͷ͋Γurqlͷ࠾༻ݟૹΓ બఆཧ༝
• ಋೖεϜʔζͰ։ൃॳظͳ͔ͬͨ • ։ൃ͕ਐΉʹͭΕ͕ͯൃੜ ◦ ΩϟογϡपΓͷෆ۩߹ ◦ Fragment Colocationͷڧ੍͕Ͱ͖ͳ͍ ◦
SuspenseͷରԠͷΕ ։ൃͯ͠Έͯ
• ్தͰRelayͷΓ͑ݕ౼͕ͨ͠அ೦ • αʔόʔ͕Global Object Identificationʹ४ڌͰ͖ͳ͔ͬͨ RelayͷΓ͑
• client presetҠߦͯ͠ɺFragment Colocationͷڧ੍ • ESLintͰ໋໊نଇͷϧʔϧՃ Apollo ClientΛ͍ଓ͚ΔํͰڥඋʹྗ
• HygenʹΑΔίϯϙʔωϯτͷܗͷੜ Apollo ClientΛ͍ଓ͚ΔํͰڥඋʹྗ
• v3.8ͰuseFragment͕Stableʹͳͬͨ ◦ Fragmentͷߋ৽ͷΈΛݕͯ͠࠶ϨϯμϦϯά ◦ SuspenseະରԠͰɺଞʹ੍͕͋ΔͷͰར༻·͍ͩ͠ • ͜ͷล͕ॆ࣮ͯ͘͠Ε࠾༻ͷ༏ઌ্͕͕Δ͔ʁ Apollo Clientͷࠓޙ
• GraphQLΛ࠷େݶ׆༻͢ΔʹFragment Colocation͕ॏཁ • ͦͷ؍ͰGraphQLΫϥΠΞϯτRelay͕͓͢͢Ί • ଞͷΫϥΠΞϯτͰ͍ۙମݧಘΒΕΔΑ͏ʹͳͬͯདྷͯΔ ·ͱΊ
THANK YOU