How to cache data from async function that uses fetch in Node

Question

I was trying to see if there was a way to cache a json response from a fetch async call, possibly using LRU.

I've tried using several packages, such as node-cache and lru-cache, but I don't think they worked because my function is asynchronous.

This is what my fetch function basically looks like:

const jsonFetch = async (url) => {
    try {
        const response = await fetch (url)
        const json = await response.json();
        return json
    }
    catch (error) {
        console.log(error)
    }
}

For example, if I get someone to hit my route 20 times in a minute, I'd like to easily fetch the data and return the response within 0.03 ms instead of 0.3 ms. Currently, it is always using the a URL to fetch the data.

Try this github.com/tugrul512bit/LruJS its fully asynchronous. — huseyin tugrul buyukisik
– huseyin tugrul buyukisik, Commented Sep 26, 2021 at 10:03

Paolo · Accepted Answer · 2020-10-20 08:20:01Z

This has been here for a while, but I agree with the comment from @sleepy012. If I wanted to avoid parallel calls, the trick should be to cache the promise, not only the value. So something like this should work:

let cache = {}
function cacheAsync(loader) {
  return async (url) => {
    if (url in cache) {                    // return cached result if available
        console.log("cache hit")
        return cache[url]
    }
    try {
        const responsePromise = loader(url)
        cache[url] = responsePromise
        return responsePromise
    }
    catch (error) {
        console.log('Error', error.message)
    }
  };
}


function delayedLoader(url) {
  console.log('Loading url: ' + url)
  return new Promise((r) => setTimeout(r, 1000,'Returning ' + url));
}

const cachedLoader = cacheAsync(delayedLoader);

cachedLoader('url1').then((d) => console.log('First load got: ' + d));
cachedLoader('url1').then((d) => console.log('Second load got: ' + d));
cachedLoader('url2').then((d) => console.log('Third load got: ' + d));
cachedLoader('url2').then((d) => console.log('Fourth load got: ' + d));
console.log('Waiting for load to complete');

Mark · Accepted Answer · 2019-06-07 00:49:47Z

-2

There's nothing about async functions that will prevent caching results. It's possible the libraries you're looking at can't handle the promises, but here's a basic proof of concept that might help to get things started:

let cache = {}
const jsonFetch = async (url) => {
    if (url in cache) {                    // return cached result if available
        console.log("cache hit")
        return cache[url]
    }
    try {
        const response = await fetch (url)
        const json = response.json();
        cache[url] = json                  // cache response keyed to url
        return json
    }
    catch (error) {
        console.log(error)
    }
}

jsonFetch("https://jsonplaceholder.typicode.com/todos/1").then((user) => console.log(user.id))

// should be cached -- same url
setTimeout(() => jsonFetch("https://jsonplaceholder.typicode.com/todos/1").then((user) => console.log(user.id)), 2000)

// not in cache
setTimeout(() => jsonFetch("https://jsonplaceholder.typicode.com/todos/2").then((user) => console.log(user.id)), 2000)

You will only get cache hits on requests made after the first request returns a value to cache

answered Jun 7, 2019 at 0:49

Mark

92.6k8 gold badges116 silver badges156 bronze badges

1 Comment

sleepy012 Over a year ago

Actually, this code is not 100% correct: if a second request to the same url comes while the first one is still awaited then a second fetch will be fired. Depending on context, this can be everything from harmless to evil.

Collectives™ on Stack Overflow

How to cache data from async function that uses fetch in Node

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related