How to efficiently import the contents of an html5 canvas into flash?

Question

I have tried to use "ExternalInterface.call()" to invoke a javascript function that returns the contents of a canvas. However, for a relatively small canvas (256x256) this is extremely slow (around 2 seconds), seemingly because of the marshalling of arguments/return value.

Even if I break down the canvas data into smaller chunks, as suggested by Brad Neuberg in an older post (from 2006): http://codinginparadise.org/weblog/2006/02/how-to-speed-up-flash-8s.html , I still get a poor performance. The size of chunks should not be an issue as of Flash 9 anyway.

I guess I could still try to overwrite the Flash javascript functions that do the marshalling/evaluation of parameters, but this seems very involved and I wanted to know if I was missing anything simpler, before attempting that.

I also tried an older way to communicate flash and javascript by doing:

var req : URLRequest = new URLRequest("javascript:getImage()"); 
var loader : Loader = new Loader();
loader.load(req);

where "getImage()" is a javascript function that returns the contents of the canvas as an image. But this throws some sort of security violation error as no browser script is allowed to be used as target URL, unless one uses the "navigateToURL()" as opposed to the "Loader.load()" function. Unfortunately the former does not return a value.

I've also seen some older code using the "com.macromedia.javascript.JavaScriptProxy" class, but I have not tested it and it does not seem to be available in Flash 11.

Any thoughts would be greatly appreciated. Thanks!

Answer 1

I can think of 2 options: one easy, one hard.

1) Round trip it to the server. It might be just as slow but it won't be prone to locking up Flash or causing a script timeout.

2) See if you can write an HTML5 WebSocket that can connect to Flash's LocalConnection. This is no small feat. This guy seems to have cracked that nut in C. He made an app that can "speak" LocalConnection.