JSFoo Pune 2019

JSFoo is a JavaScript conference hosted by HasGeek.

A glimpse of GraphQL: Frontend developers’ life is easy now!

Submitted by Navya Agarwal (@navyaagarwal) on Friday, 31 August 2018

videocam
Preview video

Technical level

Beginner

Section

Crisp talk

Status

Confirmed & Scheduled

View proposal in schedule

Vote on this proposal

Login to vote

Total votes:  +1

Abstract

In this talk we’ll walk through our journey to GraphQL at Adobe, and highlight a few of our successes and failures along the way.

Use Case:
We at Adobe Experience Cloud, wanted to redefine our customer’s experience, and as part of this redesign we wanted to focus on surfacing more data (but not at the cost of a performance overhead). This new redesign now required a mix of data from different sources to be rendered on the screen and we began to face many problems around performance, documentation, and general ease-of-use. On many pages, we found ourselves making four or five round-trips to the server to fetch the data and nit picking it at the client side in order to render it.

Solving the problem with GraphQL:
After some investigation, we thought of integrating GraphQL to our architecture— we decided to add a GraphQL proxy layer on top of our REST APIs. This was a pretty easy process- we built some utilities around making downstream REST calls to fetch data in our resolver, and wrote up some rules around converting our existing models into GraphQL and within a matter of days were ready to call our GraphQL pilot a success.

But the real challenges begin now:
One of our REST API rolled back to a previous version and suddenly every GraphQL query started failing. And what about caching? The solution to these problems and others that came across as we switched to GraphQL are covered next.

Outline

I’ll start the talk by our motivation to switch to GraphQL and how it solved the two most important problems (multiple round trips to server and overfetching of gigantic data). But as we progressed on ur journey with GraphQL, we came across some unavoidable problems (from personal experience), the solution to which I will cover next. Then I will briefly explain the Apollo client and server wrapper around GraphQL and how to use it with React. While the road has certainly been bumpy at times, we’re really able to recognize the benefits that GraphQL provides.

Requirements

Laptop and internet connection

Speaker bio

I am a polyglot developer working with Adobe Experience Cloud. I currently look after the authentication and orchestration part of the stack with the broad goal of optimizing the performance and scalability of the system. I have tried my hands-on trending technologies and introduced the same in my projects. Over the past years, I have dabbled with multiple tech stacks and have worked on various innovative ideas within the team.

Links

Slides

https://docs.google.com/presentation/d/1brXA6jXjGdjkg9chjYV2V8c5iaCu19lwF32uPLDXF9k/edit?usp=sharing

Preview video

https://youtu.be/TZiHAQyPhN8

Comments

  • 1
    Zainab Bawa (@zainabbawa) Reviewer 2 months ago

    Hello Navya, we have had talks introducing GraphQL at ReactFoo series. We are more interested in case studies. If you can restructure your proposal towards a case study and remove all content introducing GraphQL, we’ll reconsider your proposal. Share revised slides and preview video by 5 October.

    • 1
      Navya Agarwal (@navyaagarwal) Proposer 2 months ago (edited 2 months ago)

      @zainabbawa I have updated the content. As per your requirement they are now based on a case study from my personal experience.

Login with Twitter or Google to leave a comment