所以我有一个项目，我正在尝试将相当复杂的Javascript函数优化到最大程度 - 部分原因在于它应该在智能手机（Webkit）上运行并且每一点都很重要。< / p>
我一直在使用各种调试和计时技术来完成我的代码并重写可能很慢的所有内容 - 比如基于jQuery的部分，其中本机可能做得更好等等。该函数的作用基本上是采用一串html文本并将其剪切为完全适合3个没有固定位置或大小的DIV（客户端模板机制）。
目前整个功能需要大约100毫秒才能在iPad浏览器中执行（但在生产环境中我需要理想地执行200次）问题是在100毫秒之内至少20毫秒是因为这一行代码（在3个循环中）：
var maxTop = $(cur).offset().top + $(cur).outerHeight();
“cur”只是对容器DIV元素的引用，上面的行正在计算它的底部位置（所以我的文本应该中断）。从查看偏移的jQuery代码我理解它使用getBoundingClientRect甚至消除jQuery偏移/大小调整并直接调用它没有加速它 - 所以它的getBoundingClientRect错误（至少在Webkit中）。我对它进行了一些研究，我理解它会导致布局重绘。
但是仍然 - 不能相信我做多个DOM清除/克隆/附加，所有这些都比简单的元素位置查找快得多？有什么想法吗？也许某些webkit具体？或者不会导致重绘的东西？
非常感谢！
答案 0 :(得分：1)
var maxTop = cur.offsetTop + cur.offsetHeight;
指出，offsetTop和offsetHeight是本机dom属性，因此访问速度应该比通过函数更快。
答案 1 :(得分：0)
由于我也遇到了类似的问题，我有一个循环，我正在修复一系列（有时是1000多个）DOM元素（从float到absolute）。我立即将固定样式应用于元素，这是一个很大的错误：每次向DOM写入内容时，当脚本要求元素的位置时，必须重新计算样式。因此，请完成所有阅读，然后进行所有写作，即使这意味着两个独立的循环（您可以安全地写入DOM元素的数据集属性）。
另请参阅：http://gent.ilcore.com/2011/03/how-not-to-trigger-layout-in-webkit.html