Async Cache

[tanishqmanuja]

Can someone help me on using a async defaultCache for cachePlugin. I want to do filesystem IO for the cache so async is required.

[suhaotian]

What's the use cases of AsyncCache plugin?

[tanishqmanuja]

I am using octokit to get stuff from github and want cache all get requests and persist the changes during server restarts (Astro Framework). So the filesystem cache should work but I don't want to use fs modules without async because that would block the page render.

Axios supports the same via interceptors so i thought there would be some support in xior also.

[suhaotian]

To persist cache data, update xior to latest version ^0.6.3, and implement the persistCachePlugin function:

Note: The following code assumes it only runs on the server side. If you are using Next.js or Remix, please separate fs operations to the server.

import { lru, LRU } from 'tiny-lru';
import { Xior as xior, delay, Xior } from 'xior';
import xiorCachePlugin from 'xior/plugins/cache';
import fs from 'fs/promises';

export function persistCachePlugin(
  xiorInstance: Xior,
  cache: LRU<any>,
  filePath: string,
  debounceTime = 500
) {
  xiorInstance.interceptors.response.use((response) => {
    if (!response.fromCache && response.cacheKey) {
      debouncedSyncToFs();
    }
    return response;
  });

  async function initFromFs() {
    try {
      const data = JSON.parse(await fs.readFile(filePath, 'utf-8'));
      data.forEach(([key, value]: [string, any]) => {
        if (value) {
          cache.set(key, Promise.resolve(value));
        }
      });
    } catch (e) {
      console.error('initFromFs error:', e);
    }
  }

  async function syncToFs() {
    const keys = cache.keys();
    const data = await Promise.all(keys.map(async (key) => [key, await cache.get(key)]));
    await fs.writeFile(filePath, JSON.stringify(data, null, 2));
  }
  const debouncedSyncToFs = debounce(syncToFs, debounceTime);

  function debounce(func: () => Promise<void>, wait: number) {
    let timeout: NodeJS.Timeout | null = null;
    return () => {
      if (timeout) {
        clearTimeout(timeout);
      }
      timeout = setTimeout(() => {
        func();
      }, wait);
    };
  }

  return { initFromFs };
}

const http = xior.create();
const cache = lru(100, 1000 * 60 * 5);
http.plugins.use(
  xiorCachePlugin({
    enableCache: (config) => config?.method === 'GET' || config?.isGet === true,
    defaultCache: cache,
  })
);

// You need to run `initFromFs` to initialize cache data from the file before sending any requests.
const { initFromFs } = persistCachePlugin(http, cache, './cache.json', 500);

You can also check the persistent cache test file: https://github.com/suhaotian/xior/blob/main/tests/src/tests/plugins/persist-cache.test.ts

[tanishqmanuja]

Thanks 💯