AlgorithmsData structuresRuns in your browserReviewed October 1, 2026

LRU Cache Visualizer

Keep recent items and evict the one that was used the longest time ago. Interactive step-by-step animation with JavaScript code, complexity and front-end use cases.

Localprivate by defaultFastno sign-up path

Data structuresTime: O(1) per operationSpace: O(capacity)

Cache sizeOperations (put X / get X)

Cache: oldest → newest

Operation log

empty

Step 1 / 14

An LRU (least recently used) cache keeps at most 3 items. When it is full, the item that has not been used for the longest time is thrown out.

checking
found / in view
ruled out

JavaScript

1class LRUCache {
2  constructor(capacity) { this.cap = capacity; this.map = new Map(); }
3  get(key) {
4    if (!this.map.has(key)) return -1;
5    const value = this.map.get(key);
6    this.map.delete(key);
7    this.map.set(key, value);
8    return value;
9  }
10  put(key, value) {
11    this.map.delete(key);
12    this.map.set(key, value);
13    if (this.map.size > this.cap) {
14      this.map.delete(this.map.keys().next().value);
15    }
16  }
17}

Tip: use the arrow keys to step and the space bar to play or pause.

Loading animation...

LRU Cache Visualization and Animation

Keep recent items and evict the one that was used the longest time ago. On get, move the item to the newest end. On put, add the item at the newest end. If the cache is over capacity, remove the oldest item. Time complexity: O(1) per operation. Space complexity: O(capacity). Caching API responses, images and computed values in the browser without growing memory forever.

How to use LRU Cache Visualizer

On get, move the item to the newest end.
On put, add the item at the newest end.
If the cache is over capacity, remove the oldest item.
Press Play, or step through with the arrow buttons and change the input to see how it reacts.

Questions

What is LRU Cache?

Keep recent items and evict the one that was used the longest time ago.

What is the time complexity of LRU Cache?

Time: O(1) per operation. Space: O(capacity).

Where do front-end developers use LRU Cache?

Caching API responses, images and computed values in the browser without growing memory forever.

Does this upload my data?

No. This converter runs in your browser for ordinary use, so the input is not sent to a backend by this tool.

Related tools

Keep working without searching again.

Sorting