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
200
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
110
Responsive E-Mails
aimeos
0
630
gigacommerce
aimeos
0
3.1k
High performance e-commerce in Laravel
aimeos
0
910
E-Commerce in TYPO3 mit Aimeos (Deutsch)
aimeos
0
430
Aimeos - high performance e-commerce in TYPO3
aimeos
0
290
Aimeos e-commerce components
aimeos
1
200
E-Commerce in TYPO3 - Reloaded
aimeos
0
300
Micro services as architectural concept
aimeos
0
680
Other Decks in Programming
See All in Programming
CSC307 Lecture 09
javiergs
PRO
1
500
[After Kotlin Fest 2024 LT Night @ Sansan] もっともっとKotlinを好きになる!K2 Compiler Pluginで遊んでみよう!
kitakkun
2
260
DynamoDB コスト最適化っぽいことの基本 with Terraform
kuro_kurorrr
2
250
Introduction to GitOps
hwchiu
0
110
ドメイン駆動設計の実践
masuda220
PRO
19
5.2k
今こそ始める、CDKコンストラクトライブラリ開発 ― 入門から実践まで
tmokmss
1
930
20240706_CDKConf
takuyay0ne
0
1.2k
「2024年版 Kotlin サーバーサイドプログラミング実践開発」の補講 〜O/Rマッパー編〜
n_takehata
2
260
最古の関数型言語「Lisp」ことはじめ / lisp_in_kamiyama
uhooi
1
190
入社1ヶ月でここまでやった!Findy Toolsインフラ支援の最適化
rvirus0817
6
1.4k
開発部に不満を持っていたCSがエンジニアにジョブチェンしてわかった「勝手に諦めない」ことの大切さ
sakuraikotone
28
16k
Modern Angular: Renovation for Your Applications
manfredsteyer
PRO
0
140
Featured
See All Featured
A better future with KSS
kneath
231
17k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
36
9.1k
Agile that works and the tools we love
rasmusluckow
325
20k
Designing for Performance
lara
604
67k
Designing Experiences People Love
moore
136
23k
KATA
mclloyd
20
13k
Product Roadmaps are Hard
iamctodd
PRO
48
10k
What's in a price? How to price your products and services
michaelherold
239
11k
Building Better People: How to give real-time feedback that sticks.
wjessup
357
18k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
18
1.2k
We Have a Design System, Now What?
morganepeng
46
7k
Building Effective Engineering Teams - LeadDev
addyosmani
47
2.2k
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