A mini memory cache function | Andy Bell
I'm really enjoying Andy's coverage of his latest personal site build; it's always super interesting to see inside the development habits of other people, particularly those as thoughtful of the process as Andy is. I also find there's typically at least one light bulb moment 💡 In this latest outing, that moment came with the little cache utility. It's a basic getter/setter combo, formed around a simple JavaScript object, but as a lightweight state-management system and data store, I think it's really nicely done. As Andy puts it:
I also know that I’m going to be integrating Bluesky posts, so in order to keep local development as speedy as possible (and to avoid API round trips) I’m going to need a little memory cache system that stores data temporarily for us.
Which works like this:
const cache = {};
/**
* Retrieves cached data if it's available and not expired.
* @param {string} key - The cache key.
* @returns {*} The cached data or null if expired/not found.
*/
export function getCache(key) {
const cachedEntry = cache[key];
if (!cachedEntry) return null;
if (Date.now() > cachedEntry.expiry) {
delete cache[key]; // Expired, remove from cache
return null;
}
return cachedEntry.data;
}
/**
* Stores data in cache with a time-to-live (TTL).
* @param {string} key - The cache key.
* @param {*} data - The data to cache.
* @param {number} ttlSeconds - Time-to-live in seconds.
*/
export function setCache(key, data, ttlSeconds) {
cache[key] = {
data,
expiry: Date.now() + ttlSeconds * 1000,
};
}I'd be really fascinated to know how far you can push this pattern using Astro's SSR functionality. Locally, it's a useful way to hold data, but I think I'd shift at least some of this towards Local Storage.
