html5 globalalpha,alpha - HTML5 canvas performance between strokeStyle rgba/globalAlpha - Stack Over...

No, at least not any noticeable. The blending and compositing process is the same no matter what value you use for global alpha (assuming resulting backdrop alpha never is 1).

What can affect the performance is which blending mode (except lighter aka plus, as this is a composite operation) you choose (blending modes, separable and non-separable such as screen, overlay, color, hue etc. is also set via the globalCompositeOperation), as well as turning off background alpha (see below).

All browsers uses what is called Porter Duff Compositing Operators. This uses the same formula for all compositing types:

co = αs x Fa x Cs + αb x Fb x Cb

or:

color out = alpha source x Fa x Color Source +

alpha background (or destination) x Fb x Color Background

Fa/b varies depending on which operator is used, for example for source-over they would be: Fa = 1; Fb = 1 – αs.

Then the result is "mixed" back on the canvas using global alpha (Cb = containing backdrop alpha).

Cr = (1 - αb) x Cs + αb x B(Cb, Cs) // B() = Blending mode

So no matter value you use for alpha, the pixels are run through the same formulas giving no performance difference (these formulas are usually combined into a single step; for blending only intersecting areas are considered).

In theory, if backdrop alpha was 1 this last mixing stage wouldn't be needed, but as you are using alpha other than 1 for either color or globalAlpha it will need to be "mixed".

There are however a lesser known option parameter for 2D context (CanvasRenderingContext2DSettings, see green box below the interface definition):

var context = canvas.getContext("2D", {alpha: false});

Turning off background alpha can speed up performance quite a bit if you don't need the canvas background to be non-opaque.

It has been supported by old Opera a while, Chrome (or was it FF... can't remember) just recently started to support it and FF (or Chrome)/IE will support it later (it will just be ignored if not supported so there's no harm providing it).

For more details on browser implementation of compositing/blending, see this link.

Hope this gives some input (disclaimer: it's late and head not quite up to long formulas so I'll double-check tomorrow).

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值