Custom caching function for the PnP v3 request caching with the help indexeddb
npm install @simpletech/pnp-idb-cacheJavaScript
npm install @simpletech/pnp-idb-cache
yarn add @simpletech/pnp-idb-cache
`
Usage
Check demo project for the SPFx implementation
`JavaScript
import { IDBCaching } from "@simpletech/pnp-idb-cache";
/**
* With default parameters
*
* if you have not passed any cache parameters, it'll fallback to default parameters as follows
*
* keyFactory - a random unique id will be generated as cacheKey
* expireFunc - default function, returns Date object with +24 hours
* dbParams - default DB and table name will be used.
*
/
function getItems() {
sp = spfi().using(SPFx(this.context));
// get all the items from a list
sp.web.lists
// go with default cache params and expiry(24 hours) function
.using(IDBCaching())
.getByTitle("someListNameInTheSPSite")
.items()
.then(
(items) => {
console.log("data fetch completed", items);
},
() => {
console.log("data fetch failed");
}
);
}
/**
* With custom caching parameters
*
* expiry function - returning Date object with +30 seconds
* keyFactory - to return custom key
* idbParams - for custom indexeddb params - DB name and table name for cache storage
*
/
let cachingParams ={
expireFunc: () => {
const time = new Date();
time.setSeconds(time.getSeconds() + 30); // next 30 seconds
return time;
},
keyFactory: () => "data-key-3",
idbParams: { dbName: "customDBName", storeName: "customDBStoreName" }
};
function getPageProperties() {
sp = spfi().using(SPFx(this.context));
return sp.web.lists
.using(IDBCaching(cachingParams))
.getById(this.context.pageContext.list.id.toString())
.items.getById(this.context.pageContext.listItem.id)()
}
``