https://github.com/vedanty3/use-lru-cache
A React hook for managing an LRUCache (Least Recently Used Cache) in your React components.
https://github.com/vedanty3/use-lru-cache
api-caching caching-strategies customhook doubly-linked-list hashmap javascript lru-cache npm-package react react-hooks typescript
Last synced: 7 months ago
JSON representation
A React hook for managing an LRUCache (Least Recently Used Cache) in your React components.
- Host: GitHub
- URL: https://github.com/vedanty3/use-lru-cache
- Owner: vedanty3
- License: mit
- Created: 2023-12-02T16:21:48.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-12-31T07:02:04.000Z (over 2 years ago)
- Last Synced: 2025-09-12T06:59:07.313Z (8 months ago)
- Topics: api-caching, caching-strategies, customhook, doubly-linked-list, hashmap, javascript, lru-cache, npm-package, react, react-hooks, typescript
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/use-lru-cache
- Size: 39.1 KB
- Stars: 5
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
## ****useLRUCache🪝****
A React hook for managing an LRUCache (Least Recently Used Cache) in your React components.
### Installation
```bash
npm install use-lru-cache
```
### Usage
```typescript
import React from "react";
import { useLRUCache } from "use-lru-cache";
type T = number;
const App: React.FC = () => {
// Initialize an LRUCache with a capacity of 10 for numbers
// It will hold a value of type number against keys
const { get, put, getCachedData, clearCache } = useLRUCache(10);
const cachedValue = get("someKey"); // returns corresponding value if key is present else null.
put("someKey", 42); // set key as "someKey" and corresponding value will be 42
const cachedKeys = getCachedData(); // will return an array of all present keys
return (
Cached Value: {cachedValue}
{/* Render other components or UI elements */}
);
};
export default App;
```
> _Note: Replace `someKey` and `42` with your actual key and data. Adjust the generic type parameter based on the type of data you want to store in the cache corresponding to your key. A key can be a number or string._
###### _Example: [use-lru-cache.vercel.app](https://use-lru-cache.vercel.app)_
###### _Checkout `use-lru-cache` on [npm](https://www.npmjs.com/package/use-lru-cache)_
###### _Contributors_
