Embed Size (px)
Citation preview
GraphQL at the Financial Times
GraphQL
RESTGET id data
RESTGET id data
GET id2 moreData
GET data.id yetMoreData
RESTGET id data
GET id2 moreData
GET data.id yetMoreData
ᐧᐧᐧ
RESTGET id data
GET id2 moreData
GET data.id yetMoreData
ᐧᐧᐧ
GraphQL• Query based: a single request fulfils exactly the
client’s data needs
• Query language specification
• Programming language agnostic
{ article(id: 3500401) { id title mainImage(width: 50) { src alt } } }
{ “article”: { “id”: 3500401, “title”: “Hello World”, “mainImage”: { “src”: “http://…”, “alt”: “Hello” } } }
Example
Viktor Charypar @charypar
github.com/charypar
The problem with REST
service service service service service service
client client client
service service service service service service
client client client
service service service service service service
client client client
“I just have a website…”
service service service service service service
/path /other/path /a/different/path
It’s the backend complexity…
service service service service service service
/path /other/path /a/different/path
GraphQL
How GraphQL works• user-defined type system - “schema”
• server describes what data is available
• clients describe what data they require
• user-defined data fetching (“how do I get an article”)
• backend agnostic
graphql-js• reference implementation built by Facebook
• github.com/graphql/graphql-js
• currently 0.2.x
• schema definition, query parsing and execution
• no network transport
Financial Times
Next FT• project to replace and improve the current ft.com
• displaying content from a set of REST APIs
• github.com/Financial-Times/next-front-page
Demo
Next FT backend• CAPIv1 & CAPIv2
• different content available (e.g. fastFT not in v2 yet)
• slightly different response format
• CAPIv1 through Elasticsearch as a feature toggle
Front page data sources
• top stories & opinions: editorial driven CMS pages
• editor’s picks: mix of searches and pages, moving towards lists
• fastFT: CAPI content by concept + notification feed
• popular stories and live blogs not from CAPI
• related content = extra round of requests
API backends are complex
backend APIs are storage-centric
front-end APIs are product-centric
service service service service service service
/path /other/path /a/different/path
GraphQL
Demo
Practical problems• caching, Elasticsearch, mock data
• swappable backends
• first attempt: pass backend as a type parameter
• horrible hard to maintain monstrosity. Don’t.
• second attempt: execution context rootObject
• more flexible, keeps the schema clean
Results• significantly simpler and cleaner
• very easy implementation (~3 days)
• starts a little tedious, rapidly speeds up
• still very early days for graphql-js
Viktor Charypar @charypar
github.com/charypar
