css - Mac OS X WebKit 和 CSS 位置 :fixed scrolling

Question

我们在 Mac OS X 上使用 WebKit 时遇到了一个优化问题，我们希望有人能帮助我们解决这个问题。

我们已经为 Mac OS X 编写了一个 Cocoa 应用程序，它基本上管理一个指向我们在线网站的 WebView。在大多数情况下，一切都运行良好。然而，我们的网站使用 CSS 的 position:fixed 来保持一个薄的“标题栏”锁定在 WebView 的顶部，类似于 StackOverflow.com 顶部的大橙色“欢迎”栏。我们已经确定，在 position:fixed 处于事件状态时，滚动 WebView 会强制整个网页重新绘制自身，这会导致滚动缓慢得令人痛苦。禁用 position:fixed 后，滚动速度非常快且流畅；只有滚动到“ View 中”的页面元素需要绘制。

我们知道这不是我们的 Cocoa 应用程序代码中的错误，也不是我们的 HTML/CSS 代码中的问题。使用 Apple 的 WebKit 测试代码会出现同样的缓慢滚动。我们可以将Apple的测试代码指向http://www.StackOverflow.com作为测试，我们看到了完全相同的行为。我们一直在使用 Mozilla 错误数据库中的测试页面来测试问题 (https://bug201307.bugzilla.mozilla.org/attachment.cgi?id=139911)。奇怪的是，Mac 上的某些基于 WebKit 的浏览器(例如 Safari 和 Chrome)没有这个问题；在使用 CSS position:fixed 的页面上，滚动总是很快。

有没有其他人在 OS X 上遇到过 WebKit 的这个问题？如果是这样，我们可以做些什么来加快滚动速度？谢谢。

Answer 1

我可能会偏离这里，因为我不确定是否同样适用于您的 Web View ，但使用强制导航到其自己的图层的样式可能会有所帮助。

类似于 translateZ(0) 或 translate3d(0,0,0,)。我在使用 Phonegap 进行构建时遇到过类似的问题，并将一些想法应用于分层确实有所帮助。

我相信浏览器可以在涉及三维的地方利用硬件加速。