css – 为什么浏览器不够智能,硬件加速没有技巧?

现在有大量的网页建议您将这些规则添加到您的内容,以使其硬件加速:
transform: translate3d(0,0);
-webkit-transform: translate3d(0,0);

这总是让我觉得可笑.为什么浏览器需要我的帮助决定硬件加速?它会更快,对吧?那么为什么不这样做呢?为什么等我来“浏览”呢?

提出这个问题的另一种方法可能是,为什么每个基线/重置样式表都不包括线

* {
    transform: translate3d(0,0);
    -webkit-transform: translate3d(0,0);
}

解决方法

这不是很多,浏览器不能或不够聪明地使用硬件加速.相反,你所指的只是真正适用于WebKit,特别是移动版本的WebKit. Firefox和IE都硬件加速了所有内容,并自动页面分割成GPU上的“层”.这就是为什么他们通常会在渲染速度测试中击败Chrome.另一方面,WebKit从未真正适应于具有超过简单的层加速度.

因为Firefox和IE可以利用Windows平台上的Direct2D渲染(其中每个绘图操作都是硬件加速的),所以实际上它们也可以进行硬件加速合成.如果他们只是加速了绘图操作,而不是加速绘图操作,而不是使用Direct2D的速度优势,因为它需要在GPU和系统内存之间进行复制,这很慢.另一方面,我所知道的所有WebKit渲染后端完全在软件中执行渲染,并且当它们复合时(如果正在使用GPU合成),则会产生复制到GPU的惩罚.所以,它最终成为一个权衡.如果您正在合成的图层在cpu上不需要花费很多时间来渲染,则完全不需要在GPU上执行复制和复制.

由于这一点,并且移动GPU的性质极其有限,除非绝对需要(例如设置3D转换),否则WebKit浏览器中的任何一个都没有开始进行自动硬件加速.如果你想要我的意见,我还会补充说,我认为WebKit开发商和配套公司的懒惰也是一个因素.使用GPU是错误的主要来源,因此他们更容易使用它,而不是解决问题.

顺便说一下,Firefox的Firefox可以一直做GPU合成,虽然你可能需要启用它在:config;我不知道它是否在认状态.对于PC,我建议使用Firefox或IE来快速渲染.

编辑:我还要补充说,在最新版本的Android中,Google已经向Skia添加了硬件加速功能,它可以处理操作系统上几乎所有的2D渲染.没有很多设备在野外有这个,但这的确意味着性能将在不久的将来改善Android上的一切.也就是说,我不知道他们的Skia实现是否像OpenGL一样无缝地工作.合成仍然可能会产生一些额外的副本,直到他们处理它.

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效