Embed Size (px)
Citation preview
GRAPHQLSebastian Siemssen @thefubhy
A LITTLE STORY …
‣ Requires multiple round trips for fetching complex object graphs
‣ Over fetching — As the model grows, so does the payload
‣ High potential for breaking API changes
‣ Structure of the response dictated by the server
‣ Potentially a huge amount of different endpoints and thus complexity
‣ No formal specification resulting in various other shortcomings
PROBLEMS WITH REST
DEAR REST, I STILL LOVE YOU !
Multiple round trips
When fetching complex, relational data structures: In order to descent further into the object graph, multiple round trips to the server are required.
Over fetching
Unless specifically designed for a given purpose, you often have to deal with needlessly large and bloated
responses.
Compatibility and versioning
By changing your model you are very likely to break your APIs. API versioning can mitigate that potential
damage at the cost of exponentially increasing complexity.
Endpoints galore
Attempting to circumvent the aforementioned problems often leads to a huge amount of bespoke/ad-hoc endpoints. This, in turn, inevitably increases
the complexity of your application.
Your API is usually composed of a
spectrum of different interpretations of REST
No formal specification
No prescribed pattern for deprecation. No standardized introspection functionality.
…
REST IS WHAT YOU MAKE IT
„This is not not how we as product developers think about data. Product developers think of data in
terms of graphs.“
Nick Schrock
Code cartoons by Lin Clark
WHAT IS GRAPHQL?
What is GraphQL?
GraphQL is a query language designed to build client applications by providing an intuitive and flexible
syntax and system for describing their data requirements and interactions.
IT IS NOT A QUERY LANGUAGE FOR A GRAPH DATABASE
GRAPHQL IS AGNOSTIC TO YOUR
STORAGE LAYER
{ me { name } }
{ 'me': { 'name': 'Sebastian Siemssen' } }
{ me { name } }
{ user(id: 123) { name } }
{ user(id: 123) { name } }
{ 'user': { 'name': 'Sebastian Siemssen' } }
{ 'me': { 'name': 'Sebastian Siemssen', 'company': { 'name': 'Zensations', 'website': 'http://zensations.at' } } }
{ me { name, company { name, website } } }
{ 'me': { 'name': 'Sebastian Siemssen', 'profilePic': { 'width': 100, 'height': 200, 'url': 'http://...' } } }
{ me { name, profilePic(size: 100) { width, height, url } } }
{ 'me': { 'name': 'Sebastian Siemssen', 'small': { 'width': 100, 'height': 200, 'url': 'http://...' }, 'large': { 'width': 300, 'height': 600, 'url': 'http://...' } } }
{ me { name, small:profilePic(size: 100) { width, height, url }, large:profilePic(size: 300) { width, height, url } } }
{ 'me': { 'name': 'Sebastian Siemssen', 'articles': [ { 'title': 'GraphQL rocks' }, { 'title': 'Ruben sucks' }, { 'title': '...' }, { 'title': '...' }, ] } }
{ me { name, articles { title } } }
{ 'me': { 'name': 'Sebastian Siemssen', 'articles': [ { 'title': 'GraphQL rocks', 'comments': [ { 'author': { 'name': 'Ruben Teijeiro', 'label': 'This is sorcercy!' } }, { 'author': { 'name': 'Dries Buytaert', 'label': 'We need that in core!' } } ] } ] } }
{ me { name, articles { title, comments(first: 10) { author { name, label } } } } }
Code cartoons by Lin Clark
Code cartoons by Lin Clark
Code cartoons by Lin Clark
GRAPHQL CHANGES THE SERVER — CLIENT
RELATIONSHIP
THE SERVER PUBLISHES ITS POSSIBILITIES
THE CLIENT SPECIFIES ITS REQUIREMENTS
type Query { me: User, user: (id: Int!): User }
{ me { name }, user(id: 123) { name } }
type User { name: String, articles: (first: Int, orderBy: ArticleOrderEnum): [Article] }
{ me { name articles(first: 10, orderBy: CREATION_DATE) }, user(id: 123) { name, articles(first: 10, orderBy: CREATION_DATE) } }
enum ArticleOrderEnum [ CREATION_DATE, CHANGED_DATE, IMPORTANCE ]
TYPE INTROSPECTION
{ __schema { queryType { name }, types { name, fields { name, type { kind name, ofType { name } } } } } }
BUILDING A GRAPHQL SERVER
GraphQL
Your application code
Database External APIs Others
type User { name(user) { return user.name; }, articles(user, arguments) { return storage-‐>load(…); } }
There is even more …Conditionals, Fragments, Mutations, Subscriptions, …
DEMO
QUESTIONS
‣ RFC Working Draft: https://facebook.github.io/graphql/
‣ Reference implemenetation: https://github.com/graphql/graphql-js
‣ GraphiQL: https://github.com/graphql/graphiql
‣ StarWars API Playground: http://graphql-swapi.parseapp.com/
‣ GraphQL Relay: https://facebook.github.io/relay/docs/graphql-relay-specification.html
‣ Learn GraphQL: https://learngraphql.com/
‣ …
RESOURCES
