On 8/8/14, 8:43 PM, Rik Cabanier wrote:
The problem is that a large number of drawImage calls have a lot of
overhead due to JS crossings and housekeeping.

Could we please quantify this?

I measured the "JS crossings" part of this, because it's easy: Just have the C++ side of drawImage return immediately. What I see if I do that is that a drawImage call that passes an HTMLImageElement and two integers takes about 17ns on my hardware in a current Firefox nightly on Mac.

For scale, a full-up drawImage call that actually does something takes the following amounts of time in various browsers I have [1]:

Firefox nightly: ~9500ns/call
Chrome dev: ~4300ns/call
Safari 7.0.5 and WebKit nightly: ~3000ns/call

all with noise (when averaged across 100000 calls) that's way more than 17ns.

So I'm not sure "JS crossings" is a significant performance cost here. I'd be interested in which parts of "housekeeping" would be shareable across the multiple images in the proposal and how much time those take in practice.


[1] The specific testcase I used:

<!DOCTYPE html>
<img src="http://www.mozilla.org/images/mozilla-banner.gif";>
  onload = function() {
    var c = document.createElement("canvas").getContext("2d");
    var count = 1000000;
    var img = document.querySelector("img");
    var start = new Date;
    for (var i = 0; i < count; ++i) c.drawImage(img, 0, 0);
    var stop = new Date;
    console.log((stop - start) / count * 1e6 + "ns per call");

Reply via email to