🍪 Cookie Notice

We use cookies to learn how you interact with our content, and show you relevant content and ads based on your browsing history. You can adjust your settings below. Here's our policy.

Cookie settings
Skip to main content

  • GraphQL speed improvements

    Changes in:gapi

    Storyblok's GraphQL api just got huge performance improvements and the possibility to use automatic persisted queries which will save you a lot of traffic.

    Improvements:

    Usage example in Next.js of persisted queries:

    To use automatic persisted queries you need to add the library apollo-link-persited-queries like done in the Next.js example https://github.com/storyblok/nextjs-persisted-query-graphql-example.

    import { ApolloClient } from 'apollo-client'
import { InMemoryCache } from 'apollo-cache-inmemory'
import withApollo from 'next-with-apollo'
import { createHttpLink } from 'apollo-link-http'
import { createPersistedQueryLink } from 'apollo-link-persisted-queries'
import fetch from 'isomorphic-unfetch'

const GRAPHQL_URL = 'https://gapi.storyblok.com/v1/api'

const link = createPersistedQueryLink({useGETForHashedQueries: true}).concat(createHttpLink({
  fetch, // Switches between unfetch & node-fetch for client & server.
  uri: GRAPHQL_URL,
  headers: {
    'Token': 'YOUR_TOKEN',
    'Version': 'published',
    'Accept': 'application/json'
  }
}))

export default withApollo(
  ({ initialState }) =>
    new ApolloClient({
      link: link,
      cache: new InMemoryCache()
        //  rehydrate the cache using the initial data passed from the server:
        .restore(initialState || {})
    })
)
    •