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 vs. JSON:API
Search
Aimeos
September 04, 2020
Programming
1
220
GraphQL vs. JSON:API
Compares how GraphQL and the JSON REST API standard fits for e-commerce and CMS applications
Aimeos
September 04, 2020
Tweet
Share
More Decks by Aimeos
See All by Aimeos
PHP Map
aimeos
1
130
Responsive E-Mails
aimeos
0
640
gigacommerce
aimeos
0
3.1k
High performance e-commerce in Laravel
aimeos
0
920
E-Commerce in TYPO3 mit Aimeos (Deutsch)
aimeos
0
450
Aimeos - high performance e-commerce in TYPO3
aimeos
0
310
Aimeos e-commerce components
aimeos
1
210
E-Commerce in TYPO3 - Reloaded
aimeos
0
300
Micro services as architectural concept
aimeos
0
690
Other Decks in Programming
See All in Programming
.NET Frameworkでも汎用ホストが使いたい!
tomokusaba
0
230
AWS Step Functions は CDK で書こう!
konokenj
5
940
AIプログラミング雑キャッチアップ
yuheinakasaka
21
5.5k
SwiftUI移行のためのインプレッショントラッキング基盤の構築
kokihirokawa
0
200
技術を改善し続ける
gumioji
0
190
FrontendUp_新規事業で_Remixを採用した理由と対策.pdf
rymizuki
0
100
Devin入門 〜月500ドルから始まるAIチームメイトとの開発生活〜 / Introduction Devin 〜Development With AI Teammates〜
rkaga
5
1.7k
Go 1.24でジェネリックになった型エイリアスの紹介
syumai
2
330
TCAを用いたAmebaのリアーキテクチャ
dazy
0
250
Jasprが凄い話
hyshu
0
210
AWS CDKにおけるL2 Constructの仕組み / aws-cdk-l2-construct
gotok365
4
300
バイセルでの AI を用いた開発の取り組み ~ Devin, Cursor の活用事例・知見共有 ~
umaidashi
0
130
Featured
See All Featured
What's in a price? How to price your products and services
michaelherold
244
12k
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.5k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
Optimizing for Happiness
mojombo
377
70k
Practical Orchestrator
shlominoach
186
10k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
YesSQL, Process and Tooling at Scale
rocio
172
14k
Git: the NoSQL Database
bkeepers
PRO
429
65k
It's Worth the Effort
3n
184
28k
Large-scale JavaScript Application Architecture
addyosmani
511
110k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
13
1k
Embracing the Ebb and Flow
colly
84
4.6k
Transcript
GraphQL vs. JSON:API
Aimeos E-Commerce framework
None
GraphQL
Invented by Facebook
Retrieve graph data efficiently
For complex queries
Minimize response data
{ product { name media { url } } }
Queries
{"data": { "product": { "name": "Simple product", "media": [{ "url":
"http://localhost/img/simple1.jpg" },{ "url": "http://localhost/img/simple2.jpg" }] } }} Response
Advantages
One API for all client requirements
Efficient requests including related resources
Retrieve only the data you really need
Writing several (related) resources at once
Exact schema definition provided by the server
type Product { id: ID label: String status: Boolean }
Schema
Well defined query language
{ product(code: '1000.001') { label attribute(type: 'variant') { id name
} } Query
Many client side libraries available
Disvantages
No caching by CDNs or proxies possible
Optimizing queries can be hard
Clients can build deep and complex queries
Client and server are thighly coupled
All application state must be maintained by the client
Query language adds more complexity
curl -X POST -H 'Content-Type: application/json' -d '{ "query": "{
products { name } }" }' http://localhost/graphql Query
Client side caching necessary may introduce additional points of failure
{ json:api }
Invented by Ember.js
Reduce the amount of client code
Easy client and server code
Use best practices
curl -H 'Content-Type: application/json' http://localhost/jsonapi/product Query
{"data": [{ "id": 1, "type": "product", "attributes": { "uid": "1",
"code": "SP01", "name": "Simple product", } }]} Response
Advantages
Efficient requests including related resources http://localhost/jsonapi/product?include=price
{"data": [{ "id": 1, "type": "product", "attributes": { … }
"relationships": { "price": [{"id": "123"}] }}], "included": [{ "id": 123, "type": "price", "attributes": { … } }]} Response
Retrieve only the data you really need http://localhost/jsonapi/product?fields=id,name
Caching by CDNs, proxies and browsers
Client and server are decoupled
Application state managed by the server
Hypermedia As The Engine Of Application State "links": { "self":
"http://localhost/jsonapi/product/13", "next": "http://localhost/jsonapi/product/21", "basket/product": "http://localhost/jsonapi/basket/default/product" } HATEOAS
Queries can be optimized for the required use cases
API interaction is plain simple
Disvantages
Only single resource can be updated at once
No specification of the query language
No schema returned by the server
No automatic schema validation
Conclusion
GraphQL
Best for internal APIs
Perfect as single endpoint for clients
Lacks of scalability
{ json:api }
Clients and servers can evolve independently
Can scale infinitely
Not for write heavy usage
None
JSON:API Keep for the frontend
GraphQL Use for the admin backend
Aimeos aimeos.org Twitter: @aimeos facebook.com/Aimeos