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
6.9k
GraphQLクライアントの技術選定 2023冬
KazukiHayase
November 17, 2023
Tweet
Share
More Decks by KazukiHayase
See All by KazukiHayase
もし今からGraphQLを採用するなら
kazukihayase
12
5.2k
Goでテストをしやすくするためにやったこと
kazukihayase
1
810
Introduction and Insights of the Hasura-based Architecture
kazukihayase
0
940
自分だけが頑張るのをやめて、フルスタックなチームを作る
kazukihayase
2
3.2k
Goでテンプレートからファイルを自動生成するCLIを作る
kazukihayase
0
1.3k
生産性が上がり続けるチームを作るための第一歩
kazukihayase
4
3.7k
GraphQLにおけるクライアントキャッシュ戦略
kazukihayase
0
3.1k
MUIをベースにしたデザインシステムの構築
kazukihayase
0
580
Hasuraを活用するためのTips集
kazukihayase
0
34k
Other Decks in Technology
See All in Technology
S3 Tables を図解でやさしくおさらい~基本から QuickSight 連携まで/s3-tables-illustrated-basics-quicksight
emiki
1
280
Machine Intelligence for Vision, Language, and Actions
keio_smilab
PRO
0
380
名刺メーカーDevグループ 紹介資料
sansan33
PRO
0
740
Oracle Cloud Infrastructure:2025年5月度サービス・アップデート
oracle4engineer
PRO
0
300
VueUseから学ぶ実践TypeScript #TSKaigi #TSKaigi2025
bengo4com
3
5.3k
2025advance01
minamizaki
0
120
面接を通過するためにやってて良かったこと3選
sansantech
PRO
0
110
Eight Engineering Unit 紹介資料
sansan33
PRO
0
3.1k
All About Sansan – for New Global Engineers
sansan33
PRO
1
1.2k
AIオンボーディングとAIプロセスマイニング
nrryuya
5
1.1k
mnt_data_とは?ChatGPTコード実行環境を深堀りしてみた
icck
0
170
Postman AI エージェントビルダー最新情報
nagix
0
170
Featured
See All Featured
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
The Invisible Side of Design
smashingmag
299
50k
GraphQLとの向き合い方2022年版
quramy
46
14k
The Pragmatic Product Professional
lauravandoore
34
6.7k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
48
5.4k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.3k
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.5k
The Cult of Friendly URLs
andyhume
78
6.4k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
19
1.2k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
228
22k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
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