GraphQL is a popular query language for reading and mutating data in APIs and is a key technology in the trend toward headless websites. It allows web builders to make their API layer flexible, powerful, and efficient. Developers face challenges, however, when caching GraphQL APIs at the network edge. For this reason, Edgio has developed a solution that makes edge caching easy for GraphQL and lets teams host the GraphQL server in a serverless environment. GraphQL caching fills a gap in the headless and API-first web apps market and proves the value of Layer0 and Limelight joining forces.
What is GraphQL
The GraphQL query language improves on traditional REST APIs and has had tremendous growth and adoption among developers. Originally incubated at Facebook and later open-sourced, GraphQL provides declarative, efficient data fetching, significantly improving performance. On top of that, the strongly typed schema between client and server enables teams to iterate their APIs faster and independently without incurring versioning headaches.
GraphQL can be used with any backend framework or programming language. This benefit, paired with its powerful tooling (i.e. strong typing and built-in support for introspection) makes GraphQL especially popular with developers from enterprise organizations using headless or API-first architectures, such as Twitter and Airbnb. In the annual state of JS survey, GraphQL had the highest scores for awareness (98%), satisfaction (94%), and interest (87%) among developers than any other data layer solution.
Caching problems with GraphQL at the Edge
Traditional CDNs and caching software have been built around REST APIs, in which only HTTP GET requests are cacheable, and the cache key can be derived from the REST URL. Unfortunately, GraphQL, uses the more complex HTTP POST format, and the cacheability and cache keys must be determined from the HTTP body. While it would be great if a mere switch flip could cache HTTP POST, it’s not that simple. To cache GraphQL, the CDN must be able to parse and understand the GraphQL format — which they cannot. As a result, GraphQL performance is a challenge for developers.
It’s common for development teams to spend time building workarounds from scratch to cache GraphQL — and even then, caching isn’t optimal. Mismanaging GraphQL can lead to low cache hit rates. However, if done right, caching GraphQL at the edge leads to faster, more reliable, and scalable APIs. Layer0 makes this easy.
Layer0 solves caching challenges at the network edge
Layer0 provides full support for caching GraphQL APIs at the edge, leading to better performance and less traffic at your origin. Layer0 solves the key challenge of caching GraphQL APIs at the network edge by adding GraphQL parsing and support for the POST method to EdgeJS, a high-performance, JavaScript-based declarative language for edge logic. With EdgeJS, web builders can create powerful custom caching logic based on the properties of their GraphQL queries and HTTP headers, such as cookies and authentication.
With Layer0’s EdgeJS, a developer can cache information such as a product ID in an eCommerce API from a GraphQL response. It can also cache attributes such as language, currency, and personalization preferences embedded in the request headers. These may be defined by other non-GraphQL components in the stack that haven’t been migrated to GraphQL yet.
Once cached, Layer0 allows you to purge individual or collections of queries from the edge by assigning surrogate keys to each cached response. For example, in an eCommerce application, developers could use EdgeJS to give teams the ability to selectively purge the cache by product ID, product category, or any other product attribute in the query Layer0 (Edgio) console or APIs.
To understand this in more detail, watch the demo below that walks through how to convert a REST API to GraphQL and add caching at the edge using the popular Next.js framework, Apollo Server, and Layer0.
Achieve 100% cache hit rate
No other CDN works as hard as Layer0 to enable teams to maximize their cache hit rate. EdgeJS makes it easy for developers to configure caching from within their application, enabling developers to cache the previously uncacheable.
EdgeJS is flexible and powerful, supporting modern caching features like stale-while-revalidate and surrogate keys. Our customers have already used surrogate keys to connect Layer0 to their order and content management systems to clear individual product pages from the cache when inventory, price, or content changes. This lets them maintain high cache hit ratios for all the other pages and APIs that have not changed when an individual item changes.
In addition, the platform also includes automatic cache warming of the highest traffic content after a deploy. The Layer0 network intelligently coordinates routing and caching among POPs to maximize the likelihood of a cache hit. If a POP doesn’t have a piece of data, it will performantly request it from another POP before the request is forwarded to the origin server. To easily monitor website performance and cache hit rate, developers can access observability and key metrics. For granularity, the platform proactively highlights application routes that need improvement.
Edgio is trusted by the biggest streaming companies in the world, including the Premier League Football Clubs and BYJU. Edgio has over 135 Points of Presence (POP) around the globe that go beyond the average functions of a CDN and coordinate data amongst each other to warm the cache.
Serverless Hosting of GraphQL
Edgio also offers serverless services, including GraphQL hosting. Teams can manage and submit runtime calls to the GraphQL server hosted in a serverless environment on Layer0, eliminating worries about infrastructure and scale.
Boost productivity, performance, and security on Edgio
Layer0 helps web builder teams increase developer productivity, boost site performance, and improve security. Layer0 makes it easy to develop and maintain edge logic throughout the development lifecycle and deliver sub-second websites via predictive prefetching of dynamic content, making it the CDN that development teams love to use.
Layer0 includes everything development, and DevOps teams need to implement a headless or Jamstack architecture, including hosting, serverless, observability, RUM, and CI/CD integration. Teams can be flexible in how they leverage Layer0. They can use it to cache their GraphQL APIs, run their GraphQL server in a serverless environment, or host their entire headless application. Layer0 also has powerful routing options that enable teams to gradually migrate legacy applications to headless or API-first architectures in a piecemeal fashion.
GraphQL support and compatibility with legacy systems make Edgio ideal for large enterprises migrating to GraphQL with a mix of traditional and modern components.
