从UIWebView中删除HTML元素时的糟糕表现

Question

我目前正在编写一个iOS应用程序，它使用UIWebView浏览页面。有时我需要使用stringByEvaluatingJavaScriptFromString:动态删除UIWebView中的元素，但这会在我的第一代iPod touch上锁定主UI，有时长达2秒，在iPhone 3GS上可能会半秒钟。我用来删除它的JavaScript只是：

element.parentNode.removeChild(element);

没有比这更复杂的了。同时我在OpenGL ES中进行一些非常基本的2D渲染，如果重新渲染UIWebView不会锁定，我会在主线程上使用简单的CoreAnimation。可能是它必须重新计算DOM树，所有元素位置等？这真的应该锁定主UI线程吗？是我打电话stringByEvaluatingJavaScriptFromString:锁定一切吗？这是正常的，并且在这种硬件上是可以预期的吗？奇怪的是它能够在webview中渲染一些半复杂的MooTools动画，不透明度和高度变化，但删除一个单个元素需要几秒钟。

有没有人有改进的想法？也许只使用visibility: hidden隐藏元素更好，或设置opacity: 0？任何经验或明智的经验？

Answer 1

DOM树操作在所有浏览器中都非常慢，尤其是iOS Safari。关键因素是DOM树的大小。因此，最好的建议是随时删除（不要使用visibility：hidden）。

如果你可以避免使用直接dom操作而是使用setInnerHTML（），那么这将会有更好的性能。我已经看到它的工作速度提高了100倍。这是违反直觉的，但是执行大量字符串操作然后在浏览器中输入字符串要快得多。这是因为浏览器已经过优化，可以从字符串中呈现DOM树。

在您的情况下，如果您尝试同时删除多个节点，setInnerHTML可能会有所帮助。如果你只删除一个节点，那么你就会陷入困境 - 只是试着让DOM变小。

希望这有帮助。