[Bug]: memory leak when img element loading gif file

[alex8088]

Preflight Checklist

• I have read the Contributing Guidelines for this project.
• I agree to follow the Code of Conduct that this project adheres to.
• I have searched the issue tracker for a feature request that matches the one I want to file, without success.

Electron Version

13.6.1

What operating system are you using?

Windows

Operating System Version

Windows 10 / macOS

What arch are you using?

x64

Last Known Working Electron version

13.0.0 ~ 15.3.2

Expected Behavior

No memory leak

Actual Behavior

1.The memory usage will increase when the img element loading GIF picture.
2.The memory usage will increase more when the GIF picture have more frames.
3.The memory is not reclaimed when the img element is removed.
4. Use Ctrl+R will release memory
5. Both windows and macOS

Testcase Gist URL

https://gist.github.com/alex8088/0b6760532047adfe5094d6ac7cd21480

Additional Information

preload.js

// All of the Node.js APIs are available in the preload process.
// It has the same sandbox as a Chrome extension.
window.addEventListener('DOMContentLoaded', () => {
  const replaceText = (selector, text) => {
    const element = document.getElementById(selector)
    if (element) element.innerText = text
  }

  for (const type of ['chrome', 'node', 'electron']) {
    replaceText(`${type}-version`, process.versions[type])
  }

  const createEl = tagName => document.createElement(tagName)
  const appendEl = el => document.body.appendChild(el)

  // my test code
  let btn1 = createEl('button')
  btn1.textContent = 'Append'
  btn1.addEventListener('click', (e) => {
    let img = createEl('img')
    img.src = 'file:///D:\\Develop\\PRO\\github\\test\\electron\\gif memory leak\\goog.gif'
    appendEl(img)
  })
  appendEl(btn1)
  let btn2 = createEl('button')
  btn2.textContent = 'Remove'
  btn2.addEventListener('click', (e) => {
    let imgs = document.body.querySelectorAll('img')
    imgs.forEach(img => img.remove())
  })
  appendEl(btn2)
})

[ckerr]

Thanks for reporting this and helping to make Electron better!

Would it be possible for you to make a standalone testcase with only the code necessary to reproduce the issue? Electron Fiddle is a great tool for making small testcases and publishing them as gists that Electron maintainers can use.

If the bug you've found can be tested with a pass / fail test, please make the testcase exit 0 on success or nonzero on failure. The lets Electron's issue bot see what releases are affected by the bug by checking your test against different OSes and Electron versions.

I'm adding the blocked/need-repro label for this reason. After you make a test case, please link to it in a followup comment.

Thanks in advance! Your help is appreciated.

[alex8088]

@ckerr the test case : https://gist.github.com/alex8088/0b6760532047adfe5094d6ac7cd21480

the gif picture like this:
https://user-images.githubusercontent.com/25053004/141946512-49cff7e1-aa83-4fcf-bd45-19d405d7aefe.gif

[alex8088]

@ckerr plan to fix this bug ?

[dsanders11]

@alex8088, this doesn't reproduce for me on Windows 10 or macOS 11.6.1. I tried with both loading the GIF from the URL you provided, and from disk as well.

[kaianew]

I was able to reproduce it on Windows 10, loading the GIF from disk. It had the same behavior as shown in the issue GIF, and unallocated the memory on Ctrl+R like @alex8088 said. The same thing happened using Electron v16.0.4.
@ckerr I would like to take a look at it (will branch).

[alex8088]

Can anyone fix this bug, it looks like a serious bug

[github-actions]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. If you have any new additional information—in particular, if this is still reproducible in the latest version of Electron or in the beta—please include it with your comment!

[Blizzard-liu]

@alex8088 老表 这个bug 解决了吗