fs-cache
What is fs-cache?
- client-side key value store
- localforage
- namespacing
- encryption
- lifespan
localforage
- localStorage-like api
- namespacing
Storage Types
- localStorage
- websql
- indexedDB
- sessionStorage
- memory
API/Usage
<link rel="import" href="../fs-cache/fs-cache.html">
<script>
var storeName = 'persons';
var _cache = FS.cache.instance({storeName});
// indexedDB instance
_cache.getItem('KWDY-6RW')
.then(function(person){
// do stuff
});
_cache.setItem('KWDY-6RW', {name: "Frank"})
.then(function(person){
// do stuff
})
</script>
Config
{
dbName: 'db', //first level namespace (default user's cisId)
storeName: 'store', // second level namespace (please set this!)
storeVersion: 3, // version of store
type: 'local', //storage type (local|session|memory) default's to indexedDB
lifetime: 'hour' // how long cache should live (hour|day|week|twoWeeks|month) or milliseconds
}
Instance API
var _cache = FS.cache.instance();
_cache.getItem()
_cache.setItem()
_cache.removeItem()
_cache.clear()
_cache.key()
_cache.keys()
_cache.length()
_cache.getEncrypted()
_cache.setEncrypted()
FS.cache API
FS.cache.clearAll()
FS.cache.deleteAll()
FS.cache.deleteDB(dbName)
Components
<link rel="import" href="../fs-cache/fs-cache.html">
<link rel="import" href="../fs-cache/fs-cache-item.html">
<fs-cache store-name="demo" type="session" lifetime="day" cache="{{sessionDemoCache}}"></fs-cache>
<fs-cache store-name="demo" type="local" lifetime="60000" cache="{{localDemoCache}}"></fs-cache>
<fs-cache store-name="demo" type="memory" cache="{{memoryDemoCache}}"></fs-cache>
<!-- fs-cache-item double binding -->
<fs-cache store-name="demo" cache="{{demoCache}}"></fs-cache>
<fs-cache-item key="stuff" value="{{cacheValue}}" cache="[[demoCache]]" error="[[errorObj]]"></fs-cache-item>
Encryption
<link rel="import" href="../fs-cache/fs-crypto.html">
<link rel="import" href="../fs-cache/fs-cache.html">
<script>
var storeName = 'persons';
var _cache = FS.cache.instance({storeName});
// indexedDB instance
_cache.getEncrypted('KWDY-6RW')
.then(function(person){
// do stuff
});
_cache.setEncrypted('KWDY-6RW', {name: "Frank"})
.then(function(person){
// do stuff
})
</script>
Demo
<!-- fs-demo or fs-crypto-mock must be loaded first -->
<link rel="import" href="../fs-demo/fs-demo.html">
<link rel="import" href="../fs-cache/fs-crypto-mock.html">
<link rel="import" href="../fs-element/fs-element-that-uses-fs-cache.html">
<fs-demo></fs-demo>
<fs-element-that-uses-fs-cache></fs-element-that-uses-fs-cache>
Tests
<!-- fs-crypto-mock must be loaded first -->
<link rel="import" href="../fs-cache/fs-crypto-mock.html">
<link rel="import" href="../fs-element/fs-element-that-uses-fs-cache.html">
<test-fixture id="fs-indicators-fixture">
<template>
<fs-element-that-uses-fs-cache language="en"></fs-element-that-uses-fs-cache>
</template>
</test-fixture>
Encryption in Frontier
// app.js
let config = {
cacheEncryption: true,
experiments: experiments,
proxyUser: true
}
var app = module.exports = snow(__dirname, hf, config);
fs-cache-service
client
cache
server
Render
Render
Usage
class PersonTimelineService {
constructor () {
this.timelineCache = FS.cache.instance({ storeName: 'fsPersonTimeline' });
this.timelineCacheService = new FS.cache.service(this.timelineCache, true, true);
}
getTimeline (personId) {
let {cachePromise, serverPromise} = this.timelineCacheService.conditionalGet(url, personId);
let newServerPromise = serverPromise.then(data => {
// do something special with server data
return data;
});
let newCachePromise = cachePromise.then(data => {
// do something special with cached data
return data;
});
return {cachePromise: newCachePromise, serverPromise: newServerPromise};
}
}
Conditional Get Results
last 7 days

200: 56% ~1GB
AVG Payload: ~2KB
fs-cache
By Tyler Graf
fs-cache
- 844