New issue
Advanced search Search tips

Issue 760538 link

Starred by 2 users

Issue metadata

Status: WontFix
Owner: ----
Closed: Aug 13
Components:
EstimatedDays: ----
NextAction: ----
OS: Mac
Pri: 2
Type: Bug



Sign in to add a comment

Drawing video to canvas causes huge memory leaks if canvas size is specified

Reported by konstan...@24sessions.com, Aug 30 2017

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/603.3.8 (KHTML, like Gecko) Version/10.1.2 Safari/603.3.8

Steps to reproduce the problem:
1. Create canvas that has width and hight specified
2. Request webcam stream with getUserMedia
3. Start drawing media stream received from GUM to the canvas via 2d context
4. Check task manager
5. Memory consumption will rapidly increase. Refreshing the tab doesn't free up the memory

What is the expected behavior?
Memory usage should not increase as no new objects are being created.

What went wrong?
It looks like frames are getting cached after being drawn to canvas.

This doesn't happen if canvas doesn't have width and height specified and default values (300x150) are being used.

Did this work before? N/A 

Chrome version: 60.0.3112.101  Channel: stable
OS Version: OS X 10.12.6
Flash Version: 

I've created JSFiddle with a sample code that requests camera access and then renders it to canvas. If you open Task Manager you'll see quick growth of used memory.

Here's the link: https://jsfiddle.net/jhc23fjr/13/
 
Components: -Blink Blink>Canvas
Labels: Needs-Triage-M61

Comment 3 by junov@chromium.org, Aug 31 2017

Labels: -Needs-Triage-M61
Status: Available (was: Unconfirmed)
The bug is with canvases that are GPU-accelerated (size > 256x256)

The problem is relate to the fact that the canvas is never consumed (not displayed, never use as an image source). Therefore it's rendering queue is never flushed.

A possible solution would be to force periodic flushing for pages that treat canvases like they're black holes.
Thanks for explanation @junov. 

Could you perhaps elaborate how can the canvas be flushed? Canvas provided in JSFiddle example is visible, but nevertheless memory issue still persists.

Comment 5 by junov@chromium.org, Aug 31 2017

Sorry, I looked at the code too quickly.  I opened the fiddle on a computer that did not have a webcam, that's why.

But it is not completely leaky though. After a couple of minutes, memory stops increasing.
It stops on around 750Mb for me as well. But it shouldn't be like that, right? 

On some laptops web app that is running on that tab becomes slow and in some cases tab can not be closed after few mins at all (doesn't response). Also refreshing the page doesn't free up the memory, only closing the tab does.

Is there perhaps a workaround to clean up canvas rendering queue?

Comment 7 by junov@chromium.org, Aug 31 2017

Owner: junov@chromium.org
Status: Assigned (was: Available)
Yeah, this is a bug.  My best guess is that we must be filling-up a cache of some sort, and once the cache reaches its limit, RAM stops growing. but video frames are ephemeral so we should not be caching them.

That's just a guess. I'll know more when I start investigating this for real.
Cool, thanks @junov. Looking forward!
Interesting though that it doesn't happen with default canvas size (memory doesn't leak at all).
Owner: ----
Status: Available (was: Assigned)
Status: WontFix (was: Available)
Just tried on ToT Linux and didn't see any memory buildup on Task Manager;
the code around canvas has change substantially with the LowLatency-related
actions, so it might have been fixed.  Marking it as WontFix tentatively,
konstantin24@ could you try to repro on Canary plz ? Thx

Sign in to add a comment