Le filtre opacité CSS plus rapide que la propriété d'opacité?

Question

sur Cet article HTML5rocks , il indique que

En général, la propriété CSS 'OPITY' n'est pas accélérée dans le matériel, mais certains navigateurs qui implémentent des filtres à l'aide de l'accélération matérielle accélèrent la version du filtre d'opacité pour une meilleure performance.

Cela semble impliquer que dans les applications intensives de performance, il faut utiliser le filtre d'opacité au lieu de la propriété d'opacité.Par exemple, je rends une toile sous une image avec une propriété d'opacité de 0,5.Devrais-je utiliser le filtre à la place?Comment mesurer les gains de performance pour utiliser cette propriété de filtrage et sur quelles plateformes pourraient-elles y avoir une amélioration notable?

Answer 1

Premier, les effets de filtre CSS3 sont toujours un brouillon de norme et leur support de navigateur varie . Alors, réfléchissez à deux fois si vous avez vraiment besoin d'eux (par exemple, filtres CSS Dans l'article du monde réel (04.2013) rapporte des artefacts de rendu). accélération matérielle dans WebKit et GPU Composition accélérée dans Chrome donner un aperçu de leurs implémentations et suggère que la discrimination n'a aucune discrimination contre CSS2 ou CSS3 (je serais surpris s'il y avait).

second, Un revoir dans PC Magazine (01.2013) Affiche les résultats de certains points de repère en ligne par IE et Firefox équipes. Il existe des points de repère en toile, particules et CSS (rotation). Le Maxthon (utilise WebKit) et les versions d'opéra testés là-bas ne supportent pas l'accélération afin de donner un indice sur le gain de performance. En ce qui concerne la transparence: il s'agit d'ordres de grandeur moins de calculs que de rénovation afin de ne pas remarquer aucune différence pour cette opération spécifique.

Answer 2

Paul Irish dit ici que l'opacité est l'une des rares propriétés CSS que * est * GPU accéléré: https://plus.google.com/+addyosmani/posts/atryczpt

Et aussi, il existe un manque de soutien pour les filtres sur les navigateurs, comme on peut le voir ici , bien que l'opacité soit prise en charge à travers la planche: http://caniuse.com/#search=opacity .

Sans parler de la propriété Opacité est tellement plus facile à utiliser.

Je collerais avec ce que vous avez.