Memory leak due to non-existing image rendering

[kelvinau]

I actually found this issue when I was using EChart. The issue becomes very serious when I have a logic that tries to get image based on a variable. Size of globalImageCache keeps increasing after EChart's setOption.

When image is being loaded, pendingWrap from createOrUpdateImage is pushed to pending in globalImageCache.

zrender/src/graphic/helper/image.js

Line 50 in fdd6008

!isImageReady(image) && cachedImgObj.pending.push(pendingWrap);

The pending array is only cleared when the image is loaded successfully. For non-existing image, i.e. onerror, the array will not be cleared.

Memory Increase:

After I added a non-existing image 10 times

After fix:

JSFiddle Demo:
https://jsfiddle.net/kelvinau/y3axsx0w/