设计人员总是使用不透明度而不是实际颜色值来提供CSS.这会影响浏览器中的渲染性能吗?
在总是白色的背景下渲染速度更快,我实际上并不关心透明度.
<span>Hello</span>
> span {color:black;不透明度:0.7;}
> span {color:rgba(0,0.7);}
> span {color:#b3b3b3;}
我的直觉表示不透明度较慢(尽管放在GPU中),因为现在在渲染时,浏览器必须考虑背景,因此任何更改都会导致它重新绘制对象,因为这种透明性,而静态彩色对象将从不改变.
解决方法
我刚刚创建了一个包含大约50k行文本的简单HTML.
然后我使用Google性能选项来检查渲染进度.
使用span {color:black;不透明度:0.7;}:
使用span {color:rgba(0,0.7);}:
最后使用span {color:#b3b3b3;}:
因此,正如您所猜测的那样,使用不透明度会相当缓慢.