1195633 - Canvas path/stroke/fill operations are 100+ times slower than in Chrome

Status: RESOLVED WONTFIX

(Core :: Graphics: Canvas2D, defect)

Description

[Christian Sonne [:cers]]

I was working on a project for my work that includes stroking some paths in a canvas, and noticed that it was having a lot of problems hitting 60 fps, even for modest amounts of lines. After some benchmarking, it appears Firefox is more than 100 times slower than Chrome for the same operations.

Here is a summary of the results from the benchmark I wrote (linked to in the URL field), numbers are operations per second, so higher is better:

Browser       qc/stroke   lt/stroke   qc/fill
Firefox 20          526         526       198
Firefox 25          573         534       197
Firefox 30          548         507       180
Firefox 35          553         503       186
Firefox 40          975        1137       643
Firefox nightly    1032        1099       626
Chrome 44        114502       75957     75957

All tests were performed in an empty profile on the same computer (MBP), and similar results were observed in an earlier test on my desktop running Windows.

Comment 1

[Michael Bebenita [:mbx]]

Can you please attach your benchmark. Unlike Firfox, Chrome buffers drawing commands, so if you just measure the time spent to queue up the drawing commands you'll often notice that it is a lot faster. The best way to benchmark drawing operations is to measure frame rates.

Comment 2

[Christian Sonne [:cers]]

(In reply to Michael Bebenita [:mbx] from comment #1)
> Can you please attach your benchmark. Unlike Firfox, Chrome buffers drawing
> commands, so if you just measure the time spent to queue up the drawing
> commands you'll often notice that it is a lot faster. The best way to
> benchmark drawing operations is to measure frame rates.

It's already in the URL field, but sure: http://jsperf.com/canvas-quadraticcurveto-vs-lineto/2
It's somewhat harder to measure frame rates well, but in the work project I was working on Chrome averaged 60+ (which I suspect is mainly because they cap it at ~60), and Firefox was chugging along at ~40.

Comment 3

[Mayank Bansal]

On win10x64, Intel Broadwell gpu and HWA enabled, the qc/fill benchmark uses 100% of all the cores of my quadcore CPU. Is this expected?

Comment 4

[Christian Sonne [:cers]]

Attachment: test case that measures fps and visualizes distribution

I've written a test case that measures FPS instead, and visualizes the distribution. These are the results from my machine, clean profiles: http://imgur.com/a/CB83Y

The summary is:
Browser            Avg     Min     Max
Firefox Nightly  25.46   13.88  138.59
Chrome 44        60.11   31.60   66.62

Comment 5

[Jeff Muizelaar [:jrmuizel]]

(In reply to Christian Sonne [:cers] from comment #4)
> The summary is:
> Browser            Avg     Min     Max
> Firefox Nightly  25.46   13.88  138.59
> Chrome 44        60.11   31.60   66.62

What platform is this on?

Comment 6

[Christian Sonne [:cers]]

Attachment: test case that measures fps and visualizes distribution

(In reply to Jeff Muizelaar [:jrmuizel] from comment #5)
> (In reply to Christian Sonne [:cers] from comment #4)
> > The summary is:
> > Browser            Avg     Min     Max
> > Firefox Nightly  25.46   13.88  138.59
> > Chrome 44        60.11   31.60   66.62
> 
> What platform is this on?

Sorry for the delay, they are from OSX.

I also found an error in my test, which means that it was doing a lot more stroking etc than actual lineTo's. I've attached an updated version which seems to perform similarly for Firefox and Chrome (at least on my MBP)

It seems to me like Chrome is just a lot faster at stroking an empty path, which is probably not something we need to worry about.

Comment 7

[Jeff Muizelaar [:jrmuizel]]

I'm going to close this as WONTFIX as I'm not very concerned about the performance of stroking empty paths