Question

以下CSS背景大小和渐变，当应用于大型div时，会导致Firefox挂起/崩溃。渲染渐变可能非常密集，但是有谁知道为什么Firefox会在Webkit处理类似的CSS而不失败的情况下崩溃崩溃？

background-size: 4px 4px;
background-image: -moz-linear-gradient(135deg, rgba(255, 255, 255, .02) 25%, transparent 25%,
    transparent 50%, rgba(255, 255, 255, .02) 50%, rgba(255, 255, 255, .02) 75%,
    transparent 75%, transparent);

看起来缩小背景大小会导致Firefox“更难”崩溃，因为我认为这会导致渲染更多渐变。

在6.0.2,5.0.1上崩溃，但在3.6.22上渲染速度非常慢。

Answer 1

在Firefox 6或Firefox 9.0a1中使用http://jsfiddle.net/C8dTT/2/作为测试用例，我没有崩溃，它只是暂停了一段时间但最终完成了。计算梯度显然效率低下，耗时太长 - 并且您要求浏览器为网页的每个4x4字段重复计算并没有帮助。有趣的是，当我在调试器中停止执行时，运行的代码属于Intel图形驱动程序。如果gfx.direct2d.disabled首选项在Firefox中设置为false，也没有问题。因此，根本原因很可能是Direct2D或图形驱动程序中的错误 - 应该仍然值得在https://bugzilla.mozilla.org/提交错误报告，但是，他们会想要解决这个病态案例。

请注意，Firefox 3.6没有GPU加速功能，这就是您没有看到挂起的原因。

Answer 2

您已遇到https://bugzilla.mozilla.org/show_bug.cgi?id=632324

为什么这个CSS导致Firefox挂起/崩溃？

2 个答案: