Утечка памяти javascript с HTML5 getImageData

Я работал над попыткой сделать некоторые визуальные эффекты для игры на javascript, которую я создаю, и я заметил, что фрагмент кода, который я использую для модуляции цвета моих спрайтов, заставляет мой браузер использовать память все больше и больше, по-видимому, без ограничений.

Вы можете увидеть код и утечку памяти здесь: http://timzook.tk/javascript/test.html

Эта утечка памяти происходит только в моей функции updateimage (), когда я вызываю getImageData из своего контекст холста в каждом кадре (через setInterval), чтобы создать новый объект ImageData для перекраски. Я бы подумал, что сборщик мусора javascript уничтожит старый, но если нет, я понятия не имею, как уничтожить его вручную. Любая помощь в выяснении того, почему это происходит или как это исправить, будет оценена.

Мой вопрос очень похож на этот: Что вызывает утечку памяти при таком использовании getImageData, javascript, холста HTML5 Однако мне НУЖЕН мой код для запуска каждого кадра в функции, вызываемой setInterval, его Решение по перемещению его за пределы функции setInterval для меня не вариант, и я не могу оставить комментарий с вопросом, нашел ли он какой-то другой способ решения.

Примечание для людей, тестирующих его: поскольку в этом примере используется getImageData, его нельзя протестировать локально, просто поместив его в файл .html, требуется веб-сервер. Кроме того, очевидно, что он использует элементы HTML5, поэтому некоторые браузеры не будут работать с ним.

Edit: * SOLVED * Спасибо, решение, приведенное ниже, исправило это. Я не понимал, что вы можете использовать элемент холста так же, как вы можете использовать изображение в drawImage (), я реструктурировал свой код, так что теперь он использует значительно меньше памяти. Я загрузил этот измененный код на страницу, указанную выше, если кто-то хочет его увидеть.

8
задан Community 23 May 2017 в 12:03
поделиться