Canvas shadow algorithm & path rendering performance

[Vladimir Vukicevic]

On 10/4/2012 12:35 PM, Raymond Jacobs wrote:
> I am the one who added the shadow-related question to the agenda.
>
> So I will post it here:
>
> It seems as if the algorithms for drop-shadows are different between
> Firefox and say Chrome, is there no standard set for how to render a
> drop-shadow? or are some browsers not obeying it?

No standard way. I believe that Firefox renders them using the same
algorithm that CSS drop shadows are implemented; if Chrome does the
same, I'd expect CSS drop shadow usage to look similar. Can you give a
testcase that results in significantly different rendering (or different
enough that you'd consider it a problem)?

> In addition it seems as if geometric lines and path strokes are slow
> compared to bitmap operations on Canvas; does anyone know why this
> is? if it has to do with emulating them under 3D hardware I can
> understand why, as some of the features provided in the stroke api
> aren't easy to implement under a mostly vanilla 'render as wireframe'
> type 3d technique for lines.

What OS, and with what hardware accel settings? (See about:support in
Firefox) In general, we found that people were using Canvas for sprite
ops and basic rectangular fills much more frequently than they were
using the full general 2D API, especially for performance-intensive
apps. There hasn't been as much effort in optimizing the path API,
though in some cases (e.g. Windows 7 with Direct2D enabled) it should be
quite fast.

- Vlad

[Raymond Jacobs]

I am the one who added the shadow-related question to the agenda.

So I will post it here:

It seems as if the algorithms for drop-shadows are different between
Firefox and say Chrome, is there no standard set for how to render a
drop-shadow? or are some browsers not obeying it?

In addition it seems as if geometric lines and path strokes are slow
compared to bitmap operations on Canvas; does anyone know why this is? if
it has to do with emulating them under 3D hardware I can understand why, as
some of the features provided in the stroke api aren't easy to implement
under a mostly vanilla 'render as wireframe' type 3d technique for lines.

Thanks for any information regarding these perceived issues,

-Raymond Jacobs
Owner,
Ethereal Darkness Interactive
www.edigames.com

On Thu, Oct 4, 2012 at 12:28 PM, Vladimir Vukicevic <vlad...@mozilla.com>wrote:

> Hi all,
>
> Due to a very light agenda, I'm going to cancel today's meeting --
> however, there was a question on the agenda regarding canvas shadow
> algorithms and path rendering performance. I'd encourage that question to
> be sent as an email to the list! There are many more people on the list
> than attend the meeting, and such questions often need technical answers
> that aren't going to be delivered best during a teleconference.
>
> The same goes for general games-related announcements -- please feel free
> to use this list for such announcements, both to reach a broader audience
> as well as to provide an archive of them.
>
> Thanks! :)
> - Vlad
>
> ______________________________**_________________
> community-games mailing list
> communi...@lists.mozilla.**org <communi...@lists.mozilla.org>
> https://lists.mozilla.org/**listinfo/community-games<https://lists.mozilla.org/listinfo/community-games>
>

[Raymond Jacobs]

On Thu, Oct 4, 2012 at 12:38 PM, Vladimir Vukicevic <vlad...@mozilla.com>wrote:

> On 10/4/2012 12:35 PM, Raymond Jacobs wrote:
>

>> I am the one who added the shadow-related question to the agenda.
>>
>> So I will post it here:
>>
>> It seems as if the algorithms for drop-shadows are different between
>> Firefox and say Chrome, is there no standard set for how to render a
>> drop-shadow? or are some browsers not obeying it?
>>
>

> No standard way. I believe that Firefox renders them using the same
> algorithm that CSS drop shadows are implemented; if Chrome does the same,
> I'd expect CSS drop shadow usage to look similar. Can you give a testcase
> that results in significantly different rendering (or different enough that
> you'd consider it a problem)?
>

here is an example, the drop-shadow on the character appears more blurred
in FF than in Chrome:

http://edigames.com/revelimmortal/

>
> In addition it seems as if geometric lines and path strokes are slow
>> compared to bitmap operations on Canvas; does anyone know why this is? if
>> it has to do with emulating them under 3D hardware I can understand why, as
>> some of the features provided in the stroke api aren't easy to implement
>> under a mostly vanilla 'render as wireframe' type 3d technique for lines.
>>
>

> What OS, and with what hardware accel settings? (See about:support in
> Firefox) In general, we found that people were using Canvas for sprite ops
> and basic rectangular fills much more frequently than they were using the
> full general 2D API, especially for performance-intensive apps. There
> hasn't been as much effort in optimizing the path API, though in some cases
> (e.g. Windows 7 with Direct2D enabled) it should be quite fast.
>
> - Vlad
>
>

It has been a general notice on various platforms; e.g. windows 7 FF
(vanilla out of the box settings), ipad2 safari

this example notably has a lot of geom operations and it really shows
comparatively how slow things can be:
http://www.kevs3d.co.uk/dev/asteroidsbench/

-Raymond