Open Bug 926424 Opened 11 years ago Updated 2 years ago

memory leaking using canvas and websocket to stream a video

Categories

(Core :: Graphics: Canvas2D, defect)

Product:
Core
Component:
Graphics: Canvas2D
Version:
24 Branch
Platform:
x86
Windows 7
Type:
defect

Tracking

()

Status:
UNCONFIRMED

People

(Reporter: dashanchang, Unassigned)

Details

User Agent: Mozilla/5.0 (Windows NT 6.1; rv:24.0) Gecko/20100101 Firefox/24.0 (Beta/Release)
Build ID: 20130910160258

Steps to reproduce:

Memory leaking on the following testing page using canvas and websocket to stream a video to a web page:

<!DOCTYPE html>
<html>
<head>
	<meta name="viewport" content="width=320, initial-scale=1"/>
	<title>jsmpeg streaming</title>
	<style type="text/css">
		body {
			/*background: #333;*/
			text-align: center;
			margin-top: 10%;
		}	
	</style>
</head>
<body>		
	<canvas id="videoCanvas" width="640" height="480">
		<p>
			Please use a browser that supports the Canvas Element, like
			<a href="http://www.google.com/chrome">Chrome</a>,
			<a href="http://www.mozilla.com/firefox/">Firefox</a>,
			<a href="http://www.apple.com/safari/">Safari</a> or Internet Explorer 10
		</p>
	</canvas>
	<script type="text/javascript" src="jsmpg.js"></script>
	<script type="text/javascript">
		// Show loading notice
		var canvas = document.getElementById('videoCanvas');
		var ctx = canvas.getContext('2d');
		ctx.fillStyle = '#444';
		ctx.fillText('Loading...', canvas.width/2-30, canvas.height/3);

		// Setup the WebSocket connection and start the player
		var client = new WebSocket( 'ws://127.0.0.1:8084/' );
		var player = new jsmpeg(client, {canvas:canvas});
	</script>
</body>
</html> 

How to reproduce it?
If you go to this webpage you will find a way to reproduce it: 
http://phoboslab.org/log/2013/09/html5-live-video-streaming-via-websockets

You need to download nodejs and issue:
npm install ws  
node.exe stream-server.js password
ffmpeg -dshow -i video="USB2.0 Camera" -r 30 -s 640x480 -b 800k -f mpeg1video http://127.0.0.1:8082/password/640/480/



Actual results:

When you open the above video streaming page, you would see FireFox's memory grow fast till 2GB. Chrome does have this problem.


Expected results:

Memory should not grow for streaming webcamera to a web page by WebSockets.
Correct: Chrome does not have this problem.
Summary: memory leaking → memory leaking using canvas and websocket to stream a video
Nicolas, can you add this to your queue?
Flags: needinfo?(nical.bugzilla)
Affirmative
Assignee: nobody → nical.bugzilla
Flags: needinfo?(nical.bugzilla)
I could not reproduce this on either Linux and Windows 7 with both stable and nightly builds.

> When you open the above video streaming page, you would see FireFox's memory grow fast till 2GB. 

Do you mean after 2GB the memory does not grow anymore and things keep working?

If it is the case then it reminds me of skiaGL's caching behavior where we allow skia to have a fairly big cache so that it can keep textures on the GPU side and avoid uploading the same thing several times. Maybe D2D canvas does something similar, Bas, what do you think?

This page blits a lot of different images continuously in the canvas so if D2D is doing what skiaGL does, it would add each image to the cache until a certain cache size limit.

If it's just the canvas's GPU cache, then would not really be a memory leak, it would be a conscious trade off between memory and performances. In this case specifically this would not benefit performances because unlike the typical canvas game this patch never reuse the same image on the canvas, but this page is fairly untypical.

This is just a guess.
Flags: needinfo?(bas)
Could you past the content of about:support in here, to make sure we know exactly what's your configuration (as in what canvas backend we use on your computer).

And also please confirm that once the memory usage reaches a certain amount, it stops growing while things are still working properly?

2GB is an awful lot of memory, if it is just filling GPU cache we should think about lowering the limit.
Flags: needinfo?(dashanchang)
Please also paste here the content of about:memory when the problem occurs (when memory usage is already very high).
(In reply to Nicolas Silva [:nical] from comment #5)
> Could you past the content of about:support in here, to make sure we know
> exactly what's your configuration (as in what canvas backend we use on your
> computer).
> 
> And also please confirm that once the memory usage reaches a certain amount,
> it stops growing while things are still working properly?
> 
> 2GB is an awful lot of memory, if it is just filling GPU cache we should
> think about lowering the limit.

That's unlikely to be it unless there's a leak elsewhere.
Flags: needinfo?(bas)
Assignee: nical.bugzilla → nobody
Flags: needinfo?(dashanchang)
Severity: normal → S3
You need to log in before you can comment on or make changes to this bug.