Created attachment 363637 [details]
Canvas elements without a strong references do not get garbage collected immediately in Safari on iOS 12. No issues in iOS 11.
There is more information on https://stackoverflow.com/questions/52532614/total-canvas-memory-use-exceeds-the-maximum-limit-safari-12 which also indicate it can occur in Safari on Mac also, but the higher canvas memory limit makes it harder to trigger the bug there.
The regression between Safari on iOS 11 and iOS 12 could be as a result of https://github.com/WebKit/webkit/commit/5d5b478917c685e50d1032ccf761ca53fc8f1b74#diff-b411cd4839e4bbc17b00570536abfa8f making the bug easier to hit with the lower canvas memory limit.
If I explicitly set the canvas elements width and height to 0 before removing references to the canvas elements the issue disappears.
This bug causes a problem with the map on https://www.yr.no/en/map/radar/1-72837/Norway/Oslo/Oslo/Oslo which uses OpenLayers. OpenLayers has an issue tracking this issue also on https://github.com/openlayers/openlayers/issues/9166
I've attached a testcase, but the testcase is also available on https://output.jsbin.com/ganafaketa/1
I've tested this bug with iOS 12.1.4 on an iPhone X.
The error message I get when the bug occurs is:
TypeError: null is not an object (evaluating 'context.fillRect')
Created attachment 363639 [details]
Screenshot from TimeLine in Safari developer tools
I've added a screenshot from TimeLine in Safari developer tools.
I followed the testcase instructions when recording that timeline, the button click that triggered the error message was done just after the 13 second mark.
Interestingly, I can reproduce this in STP 76 on macOS Mojave, but not on Safari 12.0.3.
In STP, there's very few GCs happening while memory consumption increases as you press the button and none lead to the memory reported in the Timeline decreasing.
[Warning] Total canvas memory use exceeds the maximum limit (384 MB). (runner, line 31)