Compress them data + store in IndexedDB instead
This commit is contained in:
parent
f4483e1ee4
commit
b6684d90b5
|
@ -35,6 +35,7 @@
|
|||
"hash-sum": "^2.0.0",
|
||||
"js-cookie": "3.0.5",
|
||||
"localforage": "1.10.0",
|
||||
"pako": "^2.1.0",
|
||||
"parse-link-header": "2.0.0",
|
||||
"phoenix": "1.7.7",
|
||||
"punycode.js": "2.3.0",
|
||||
|
|
|
@ -312,7 +312,7 @@ const interfaceMod = {
|
|||
},
|
||||
async applyTheme (
|
||||
{ dispatch, commit, rootState, state },
|
||||
{ recompile = true } = {}
|
||||
{ recompile = false } = {}
|
||||
) {
|
||||
// If we're not not forced to recompile try using
|
||||
// cache (tryLoadCache return true if load successful)
|
||||
|
@ -350,15 +350,15 @@ const interfaceMod = {
|
|||
|
||||
let majorVersionUsed
|
||||
|
||||
console.log(
|
||||
`USER V3 palette: ${userPaletteName}, style: ${userStyleName} , custom: ${!!userStyleCustomData}`
|
||||
console.debug(
|
||||
`User V3 palette: ${userPaletteName}, style: ${userStyleName} , custom: ${!!userStyleCustomData}`
|
||||
)
|
||||
console.log(
|
||||
`USER V2 name: ${userThemeV2Name}, source: ${!!userThemeV2Source}, snapshot: ${!!userThemeV2Snapshot}`
|
||||
console.debug(
|
||||
`User V2 name: ${userThemeV2Name}, source: ${!!userThemeV2Source}, snapshot: ${!!userThemeV2Snapshot}`
|
||||
)
|
||||
|
||||
console.log(`INST V3 palette: ${instancePaletteName}, style: ${instanceStyleName}`)
|
||||
console.log('INST V2 theme: ' + instanceThemeV2Name)
|
||||
console.debug(`Instance V3 palette: ${instancePaletteName}, style: ${instanceStyleName}`)
|
||||
console.debug('Instance V2 theme: ' + instanceThemeV2Name)
|
||||
|
||||
if (userPaletteName || userPaletteCustomData ||
|
||||
userStyleName || userStyleCustomData ||
|
||||
|
@ -446,7 +446,7 @@ const interfaceMod = {
|
|||
return result
|
||||
}
|
||||
|
||||
console.log('VERSION', majorVersionUsed)
|
||||
console.debug('Version used', majorVersionUsed)
|
||||
|
||||
if (majorVersionUsed === 'v3') {
|
||||
const palette = await getData(
|
||||
|
@ -471,7 +471,7 @@ const interfaceMod = {
|
|||
] = paletteDataUsed
|
||||
paletteDataUsed = { name, bg, fg, text, link, cRed, cBlue, cGreen, cOrange }
|
||||
}
|
||||
console.log(paletteDataUsed)
|
||||
console.debug('Palette data used', paletteDataUsed)
|
||||
|
||||
const style = await getData(
|
||||
'style',
|
||||
|
@ -506,7 +506,6 @@ const interfaceMod = {
|
|||
directives: {}
|
||||
}
|
||||
|
||||
console.log('PALETTE', paletteDataUsed)
|
||||
Object
|
||||
.entries(paletteDataUsed)
|
||||
.filter(([k]) => k !== 'name')
|
||||
|
|
|
@ -2,6 +2,8 @@ import { init, getEngineChecksum } from '../theme_data/theme_data_3.service.js'
|
|||
import { getCssRules } from '../theme_data/css_utils.js'
|
||||
import { defaultState } from '../../modules/config.js'
|
||||
import { chunk } from 'lodash'
|
||||
import pako from 'pako'
|
||||
import localforage from 'localforage'
|
||||
|
||||
// On platforms where this is not supported, it will return undefined
|
||||
// Otherwise it will return an array
|
||||
|
@ -87,12 +89,15 @@ export const generateTheme = (inputRuleset, callbacks, debug) => {
|
|||
return { lazyProcessFunc: processChunk }
|
||||
}
|
||||
|
||||
export const tryLoadCache = () => {
|
||||
const json = localStorage.getItem('pleroma-fe-theme-cache')
|
||||
if (!json) return null
|
||||
export const tryLoadCache = async () => {
|
||||
console.info('Trying to load compiled theme data from cache')
|
||||
const data = await localforage.getItem('pleromafe-theme-cache')
|
||||
if (!data) return null
|
||||
let cache
|
||||
try {
|
||||
cache = JSON.parse(json)
|
||||
const decoded = new TextDecoder().decode(pako.inflate(data))
|
||||
cache = JSON.parse(decoded)
|
||||
console.info(`Loaded theme from cache, size=${cache}`)
|
||||
} catch (e) {
|
||||
console.error('Failed to decode theme cache:', e)
|
||||
return false
|
||||
|
@ -136,16 +141,10 @@ export const applyTheme = (input, onFinish = (data) => {}, debug) => {
|
|||
adoptStyleSheets([eagerStyles, lazyStyles])
|
||||
const cache = { engineChecksum: getEngineChecksum(), data: [eagerStyles.rules, lazyStyles.rules] }
|
||||
onFinish(cache)
|
||||
try {
|
||||
localStorage.setItem('pleroma-fe-theme-cache', JSON.stringify(cache))
|
||||
} catch (e) {
|
||||
localStorage.removeItem('pleroma-fe-theme-cache')
|
||||
try {
|
||||
localStorage.setItem('pleroma-fe-theme-cache', JSON.stringify(cache))
|
||||
} catch (e) {
|
||||
console.warn('cannot save cache!', e)
|
||||
}
|
||||
const compress = (js) => {
|
||||
return pako.deflate(JSON.stringify(js))
|
||||
}
|
||||
localforage.setItem('pleromafe-theme-cache', compress(cache))
|
||||
}
|
||||
},
|
||||
debug
|
||||
|
|
|
@ -7201,6 +7201,11 @@ p-try@^2.0.0:
|
|||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/p-try/-/p-try-2.0.0.tgz#85080bb87c64688fa47996fe8f7dfbe8211760b1"
|
||||
|
||||
pako@^2.1.0:
|
||||
version "2.1.0"
|
||||
resolved "https://registry.yarnpkg.com/pako/-/pako-2.1.0.tgz#266cc37f98c7d883545d11335c00fbd4062c9a86"
|
||||
integrity sha512-w+eufiZ1WuJYgPXbV/PO3NCMEc3xqylkKHzp8bxp1uW4qaSNQUkwmLLEc3kKsfz8lpV1F8Ht3U1Cm+9Srog2ug==
|
||||
|
||||
pako@~1.0.2:
|
||||
version "1.0.11"
|
||||
resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.11.tgz#6c9599d340d54dfd3946380252a35705a6b992bf"
|
||||
|
|
Loading…
Reference in a new issue