У меня есть элемент div с несколькими background-image, но в разных позициях [0..n].
Формат изображения png, но анимированный (apng).
В начале В каждой позиции нет изображений (backgroundImage: нет, нет, ..., нет). Однако каждый раз, когда я обновляю это свойство анимированным спрайтом в определенной позиции, кэш сохраняет все предыдущие изображения, на которые есть ссылки в свойстве, и память продолжает увеличиваться.
function test() {
let charImg = ''
for (let i=0; i<g.characterList.image.length; i++) {
if (charImg !== '') charImg += ', '
let param = '#date=' + new Date().getTime()
charImg += 'url("./sprite.png' + param + '")'
}
const character = document.getElementById('character')
character.style.backgroundImage = charImg
}
В этом примере я вызываю test () с простым событием onclick. Каждый вызов увеличивает память, не очищаясь сборщиком мусора.
Я даже пытался удалить элемент div из dom и создать новый с новым свойством background-image с тем же результатом.
Я даже добавил следующее в свой html:
<meta http-equiv='cache-control' content='no-cache, no-store, max-age=0, must-revalidate'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>
Для информации, мне нужен параметр в URL, поэтому спрайт перезагружается каждый раз, когда я устанавливаю background-image свойство.
Есть ли решение или альтернатива этой проблеме helli sh? Заранее спасибо.
Память при запуске приложения
Память после многократного вызова теста