html - CSS 转换 3d 性能问题

Question

我现在一直在创建html5 & css3 Web 应用程序。
我正在使用谷歌浏览器作为测试平台。并使用css transform3d属性在 Web 浏览器中实现 3d 相机和 3d 世界。
不是 WebGL。（因为 WebGL 不能直接渲染 HTML 元素。）

如果它有许多要绘制的分区（div 元素），则 chrome 无法全部绘制。
背景图像和一些部门丢失了。
所以它变成了白屏。

我怎么解决这个问题？

我认为这是chrome的硬件加速错误。
我怎样才能通过？

Answer 1

使用 3d 变换时，背景图像确实会导致问题和闪烁。

将图像背景移动到一个您不想应用 3d 变换的容器中，然后尝试。还要确保你有-webkit-backface-visibility: hidden;

有关更多信息，请参阅此链接：防止 webkit-transform 的 webkit-transition 闪烁