I have an HTML canvas on-screen that renders using a WebGL context; memory will leak when I resize that canvas’ width and height properties in iOS Safari. This behavior does not happen on any desktop browser. I made a barebones example using jsfiddle which reproduces the issue on iOS Safari: https://jsfiddle.net/fjbn9qk4/ To render the example at full screen on a device, use this link: https://jsfiddle.net/fjbn9qk4/show The example automatically resizes a WebGL canvas every 1 second using two different sets of dimensions. Every frame it renders a quad – all I do is call a handful of GL routines to get the quad on the screen (I do not create any new GL objects explicitly after the initial setup). This issue can also be reproduced if the example is made to simply respond to resizing and I rotate the orientation of the device back and forth from portrait to landscape. When this sample runs on Safari iOS on an iPad Air 3 running iOS 14.2, Safari page memory usage steadily increases every resize. After letting it run for a while, the browser process gets terminated after it reaches 1.25GB memory. It started at less than 300MB. If I run this same example in a desktop browser, the memory usage is steady the entire time. The issue appears to be limited to canvases that use WebGL contexts. Canvases using 2D rendering contexts appear unaffected. Anyone else seeing this or know of a workaround? Rendering to an offscreen WebGL canvas and using drawImage() to transport it to an on-screen 2d canvas is a solution, but I see lower performance in some browsers, including iOS Safari.
I'm pretty sure this is a duplicate of Bug 218100, which was itself resolved as a side effect of Kimmo's fix for Bug 217212, and which was duplicated into it. Kimmo, could you confirm and duplicate this into Bug 217212 as necessary?
<rdar://problem/72464396>
FYI: I upgraded to iOS 14.3 and this problem appears to be fixed.
Great. Duplicating this. *** This bug has been marked as a duplicate of bug 217212 ***