Skip to content

Update Article Feed for Inserts

With FastQL, you can give aliases to top level fields or queries and then purge all of the caches using that alias. This can be a very powerful tool, especially when combined with partial query caching.

News Example

Lets say you have a news site with many article pages that looked like this:

Article Page Wireframe

The great thing about GraphQL is that you can build this page with just one call to your GraphQL server. That's commonly done using query batching or query merging, and supported in popular GraphQL clients.

Your query for this page might look like:

query ArticlePage($articleID: ID!) {
  Article(id: $articleID) {
    ...
  }
  allArticles(orderBy: createdAt_DESC) {
    ...
  }
  allCategories(filter: {type: 'featured'}) {
    ...
  }
}

And you'd get a result like:

{
  "data" : {
    "Article" : { ... },
    "allArticles" : [ ... ],
    "allCategories" : [ ... ]
  }
}

So the challenge is now, how do you keep the "Latest Articles" widget always up to date, but still keep everything else cached? For a news site it's important that fresh articles makes it to all pages immediately.

Step 1: Give Aliases to Each Sub-Query

In GraphQL you can using field aliases to name each field or tree in your query. Often you would use them to prevent naming collisions, but you might also use them so the data object in your results has more descriptive keys in it.

We can add aliases to this query very easily:

query ArticlePage($articleID: ID!) {
  article: Article(id: $articleID) {
    ...
  }
  latestArticles: allArticles(orderBy: createdAt_DESC) {
    ...
  }
  featuredCategories: allCategories(filter {type: 'featured'}) {
    ...
  }
}

Now your data in the response of this query will have article, latestArticles, and featuredCategories. These names are not only more descriptive of what they contain, it can also be used with FastQL to invalidate the cache when new articles or categories are added.

Step 2: Invalidate an Alias

So now, anytime you add a new article all you have to do is invalidate the alias latestArticles. You can do this manually using the invalidate object API endpoint, or by adding a hint to your insert mutation.

Bonus!

Due to partial caching, even if this alias is used on thousands of article pages, it will only result in 1 call to your origin server from each region to rebuild this cache. Fine-grained invalidation!

Invalidating with a Mutation

When you send a mutation, you can optionally send a header variable Cache-purge with a comma separated list of aliases to purge. You do not need to modify the mutation at all.

So you send your mutation like you normally do:

mutation CreateArticle(...) {
  createArticle(...) { ... }
}

With an additional header: Cache-purge: latestArticles

Done! Your latest articles widget will now be refreshed across your entire site.

Invalidating with the FastQL API

To invalidate using the API, see the documentation for the invalidate object API endpoint.