I’m creating an application where I’m cutting an image into pieces by creating a canvas.
The problem is that if I’m doing it multiple times, the devices memory cache is full because the canvas (and especially the pieces I have created) never gets deleted, I’m getting the error message in the Safari console (while running via iOS simulator):
Total canvas memory use exceeds the maximum limit (224 MB)
Therefore I’m looking for a solution on how to clear the memory, maybe if possible the canvas elements only.
I’ve found a plugin but I’m not sure how to use that.
Does anybody know how to do that?
Thank you so much in advance!
If you google your error message, you should see some StackOverflow threads with suggestions about zeroing out the dimensions of the canvas before disposal. Perhaps that’s worth a try.
I have already tried different things like resetting the canvas.
Although the canvas objects still remain in the device’s memory and aren’t cleared.
I have two pages:
page lets you select an image from a list
page cuts this image into (jigsaw puzzle) pieces by using canvas.
I’m navigating between these pages by using the router: this.router.navigate(['secondpage']
Maybe there’s a different way of navigating which clears the devices memory when opening the second page?
I also found a post on Stackoverflow. Does anybody know how to implement this in Ionic 4/5?
we have the same problem using Cytoscape JS in a Ionic project; on new graph representastion we destroy the old one (with cy.destroy) but nothing: the canvas never clear his content so after some new graph the app crashes 'because “Total canvas memory use exceeds the maximum limit”.
I didn’t solve it yet.
Do you face this issue within an emulator or a real device?
Because for me it seems to happen in an emulator only. Although I didn’t have time to test it on multiple real devices (iPhone X and iPad Pro 2018 don’t seem to have problems).