npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@jesstelford/apollo-cache-invalidation

v0.0.3-gh3-gh5

Published

Experimental caching tools for Apollo.

Downloads

41

Readme

Apollo Cache Invalidation

A library to simplify cache invalidation for Apollo clients.

Build status sponsored by Taller

Installation

yarn add apollo-cache-invalidation

Or npm install --save apollo-cache-invalidation, if you are still in the old days.

Motivation

Cache control - and most of invalidation - is still a discussing issue for the Apollo Client team and the community involved. While participating in one of those issues, I've proposed a way to do field-based cache invalidation. This projects aims to fulfil this need, while something like this isn't implemented in core.

How does it work

This project exposes invalidateFields: a generator for a mutation update function implementation specialized in invalidating cache based on field paths.

In some cases after a mutation you want to invalidate cache on other queries that might have become outdated, but you can't really update their results from the data provided by the mutation. The refetchQueries is often the tool of choice, but it allows no deep field invalidation, meaning you'll have to invalidate the exact and very specific performed queries. invalidateFields is an alternative.

Usage

import { invalidateFields, ROOT } from 'apollo-cache-invalidation'
import gql from 'graphql-tag'

import { client } from './client' // Apollo Client instance.

const mutation = gql`
  mutation MakeUserHappy($user: ID!) {
    makeUserHappy(user: $user) {
      id
    }
  }
`

// Invalidate happyPeople field on the Root Query. Force it to run again.
const update = invalidateFields((proxy, result) => [
  [ROOT, 'happyPeople']
])

client.mutate({ mutation, update, variables: { user: 1 } })

The function provided to invalidateFields will receive a DataProxy instance and the result for the mutation as arguments. It must then return an array of field paths to invalidate. Each field path consist of an array of keys. Each key can be one of:

  • String: the key to invalidate;
  • RegExp: regex to match keys to invalidate;
  • Function: custom matching function to match keys to invalidate.

Each path will be compared individually to the whole cached data, invalidating any matched fields (possibly multiple) along the way.

The first key in a field path will test against either an object id (as resolved by the dataIdFromObject Apollo client config) or the ROOT_QUERY special key. In that case, you can provide the string 'ROOT_QUERY', or better, use the exported ROOT constant, as shown above.

Regex matching sample

Imagine you wan't to invalidate field happy for every user after a given mutation. Having a dataIdFromObject as such:

// Concatenate "__typename" and "id" field values to find identification.
// Do not uniquely identify resource if one of the fields is not provided
// (will use queried field name and variables, by default).
const dataIdFromObject = ({ __typename, id }) => {
  if (__typename && id) return __typename + id
  return null
}

you can invalidate a given field on all User type cached object with the following:

const update = invalidateFields(() => [[/^User[0-9]+$/, 'happy']])

client.mutate({ mutation, update })

Function matching

Similar to the Regex matching, you can do any customized field matching as so:

const randomKeyMatch = key => Math.random() >= 0.5

const update = invalidateFields(() => [
  [randomKeyMatch, 'happy']
])

client.mutate({ mutation, update })

This package should be temporary

I believe something similar to what is accomplished by this package should be soon added to the Apollo Client core. If someday that happens, this package will either be deprecated or hold other experimental functionality on the subject of caching and invalidation.