I want to cache large objects in JavaScript. These objects are retrieved by key, and it makes sense to cache them. But they won't fit in memory all at once, so I want them to be garbage collected if needed - the GC obviously knows better.

It is pretty trivial to make such a cache using WeakReference or WeakValueDictionary found in other languages, but in ES6 we have WeakMap instead, where keys are weak.

So, is it possible to make something like a WeakReference or make garbage-collected caches from WeakMap?

I want to cache large objects in JavaScript. These objects are retrieved by key, and it makes sense to cache them. But they won't fit in memory all at once, so I want them to be garbage collected if needed - the GC obviously knows better.

It is pretty trivial to make such a cache using WeakReference or WeakValueDictionary found in other languages, but in ES6 we have WeakMap instead, where keys are weak.

So, is it possible to make something like a WeakReference or make garbage-collected caches from WeakMap?

• javascript
• caching
• garbage-collection
• ecmascript-6
• ecmascript-harmony

• In JC it is assumed, that an object is immediately collected when it is no more needed. Hence, caching with WeakRefs does not make any sense. If you need to Cache large objects, use the Browser's Cache (if they come from a server) or sessionStorage. In a Node environment use Redis or Memcached. – Tino Commented Mar 31, 2018 at 10:40
• @Tino: Your link contradicts your claim. Specifically: "As of 2012, all modern browsers ship a mark-and-sweep garbage-collector." and "As of 2019, it is not possible to explicitly or programmatically trigger garbage collection in JavaScript." Mark-and-sweep GCs do not reclaim memory immediately or even deterministically. – j_random_hacker Commented Jan 11, 2022 at 6:35
• @j_random_hacker YMMV, but it would be a very dumb implementation of a MM to not immediately free a large object which is only held by a WeakRef (with refcount 0) and instead leave it all to Mark-and-Sweep. So the (my) assumption isn't entirely false. Today it is far more important to note, that WeakRefs are now supported by ES11 / ECMA-Script 2020 in all major browsers. But it still makes no sense to use WeakRef instead of some real caching implementation, so the accepted answer still holds. – Tino Commented Jan 12, 2022 at 20:46
• @Tino: Thanks for noticing the arrival of WeakRefs, this is great news! I suggest writing an answer. However, everything else you wrote is either unclear or wrong. You claim "it still makes no sense to use WeakRef instead of some real caching implementation", but from the explainer doc linked to by your link: "A primary use for weak references is to implement caches or mappings holding large objects". What do you mean by "MM"? Memory manager? When M&S is being used, M&S is the memory manager, and doesn't do refcounting so it can't efficiently detect zero refcounts. – j_random_hacker Commented Jan 14, 2022 at 21:07
• @Tino: WeakRefs were added to ES12/2021, according to para. 15 here. – j_random_hacker Commented Jan 15, 2022 at 2:45

4 Answers 4

It's now possible thanks to FinalizationRegistry and WeakRef

Example:

class WeakRefMap<K, V extends object> {
  private cacheMap = new Map<K, WeakRef<V>>();
  private finalizer = new FinalizationRegistry((key: K) => {
    console.log(`Finalizing cache: ${key}`);
    this.cacheMap.delete(key);
  });

  set(key: K, value: V): void {
    const cache = this.get(key);
    if (cache) {
      if (cache === value) return;
      this.finalizer.unregister(cache);
    }
    this.cacheMap.set(key, new WeakRef(value));
    this.finalizer.register(value, key, value);
  }

  get(key: K): V | null {
    return this.cacheMap.get(key)?.deref() ?? null;
  }
}

Note: If you are using an object type as key, avoid referencing the value inside the key which would cause memory leaks. Just to be safe, I would recommend only allowing string(s) as keys.

class WeakRefMap<K extends string, V extends object>

There are two scenarios where it's useful for a hash map to be weak (yours seems to fit the second):

1. One wishes to attach information to an object with a known identity; if the object ceases to exist, the attached information will become meaningless and should likewise cease to exist. JavaScript supports this scenario.

2. One wishes to merge references to semantically-identical objects, for the purposes of reducing storage requirements and expediting comparisons. Replacing many references to identical large subtrees, for example, with references to the same subtree can allow order-of-magnitude reductions in memory usage and execution time. Unfortunately JavaScript doesn't support this scenario.

In both cases, references in the table will be kept alive as long as they are useful, and will "naturally" become eligible for collection when they become useless. Unfortunately, rather than implementing separate classes for the two usages defined above, the designers of WeakReference made it so it can kinda-sorta be usable for either, though not terribly well.

In cases where the keys define equality to mean reference identity, WeakHashMap will satisfy the first usage pattern, but the second would be meaningless (code which held a reference to an object that was semantically identical to a stored key would hold a reference to the stored key, and wouldn't need the WeakHashMap to give it one). In cases where keys define some other form of equality, it generally doesn't make sense for a table query to return anything other than a reference to the stored object, but the only way to avoid having the stored reference keep the key alive is to use a WeakHashMap<TKey,WeakReference<TKey>> and have the client retrieve the weak reference, retrieve the key reference stored therein, and check whether it's still valid (it could get collected between the time the WeakHashMap returns the WeakReference and the time the WeakReference itself gets examined).

is it possible to make WeakReference from WeakMap or make garbage-collected cache from WeakMap ?

AFAIK the answer is "no" to both questions.

As the other answers mentioned, unfortunately there's no such thing as a weak map, like there is in Java / C#.

As a work around, I created this CacheMap that keeps a maximum number of objects around, and tracks their usage over a set period of time so that you:

1. Always remove the least accessed object, when necessary
2. Don't create a memory leak.

Here's the code.

"use strict";

/**
 * This class keeps a maximum number of items, along with a count of items requested over the past X seconds.
 * 
 * Unfortunately, in JavaScript, there's no way to create a weak map like in Java/C#.  
 * See https://stackoverflow.com/questions/25567578/garbage-collected-cache-via-javascript-weakmaps
 */
module.exports = class CacheMap {
  constructor(maxItems, secondsToKeepACountFor) {
    if (maxItems < 1) {
      throw new Error("Max items must be a positive integer");
    }
    if (secondsToKeepACountFor < 1) {
      throw new Error("Seconds to keep a count for must be a positive integer");
    }

    this.itemsToCounts = new WeakMap();
    this.internalMap = new Map();
    this.maxItems = maxItems;
    this.secondsToKeepACountFor = secondsToKeepACountFor;
  }

  get(key) {
    const value = this.internalMap.get(key);
    if (value) {
      this.itemsToCounts.get(value).push(CacheMap.getCurrentTimeInSeconds());
    }
    return value;
  }

  has(key) {
    return this.internalMap.has(key);
  }

  static getCurrentTimeInSeconds() {
    return Math.floor(Date.now() / 1000);
  }

  set(key, value) {
    if (this.internalMap.has(key)) {
      this.internalMap.set(key, value);
    } else {
      if (this.internalMap.size === this.maxItems) {
        // Figure out who to kick out.
        let keys = this.internalMap.keys();
        let lowestKey;
        let lowestNum = null;
        let currentTime = CacheMap.getCurrentTimeInSeconds();
        for (let key of keys) {
          const value = this.internalMap.get(key);
          let totalCounts = this.itemsToCounts.get(value);
          let countsSince = totalCounts.filter(count => count > (currentTime - this.secondsToKeepACountFor));
          this.itemsToCounts.set(value, totalCounts);
          if (lowestNum === null || countsSince.length < lowestNum) {
            lowestNum = countsSince.length;
            lowestKey = key;
          }
        }

        this.internalMap.delete(lowestKey);
      }
      this.internalMap.set(key, value);
    }
    this.itemsToCounts.set(value, []);
  }

  size() {
    return this.internalMap.size;
  }
};

And you call it like so:

// Keeps at most 10 client databases in memory and keeps track of their usage over a 10 min period.
let dbCache = new CacheMap(10, 600);