为什么这个窗口的表现。内阁如此糟糕？

Question

我正在测试一个我的朋友注意到的测试用例。他在循环中使用了window.inner高度，并且fps中有一个非常显着的下降。

这是我为测试它而创建的jsperf的链接http://jsperf.com/innerheight

我能想到的唯一解释是，这是一个吸气剂，并在每次通话时计算实际高度。是对的吗？我可以验证这个的任何文件吗？

Answer 1

这个问题是在几年前发布的，但万一其他人在这里遇到了类似的结果。

从此blog：

  

问题是WebKit喜欢在每次使用类似于getBoundingClientRect的东西时重新计算dom的布局。 （即使获取window.innerHeight / innerWidth也会强制重新计算）...应该缓存或避免从DOM获取任何计算维度的所有调用。

在初始化和每次调整大小时缓存一次窗口尺寸可以显着改善我的性能。

Answer 2

在第一个循环（innerheight）中，您正在访问对象属性并将其分配给h。在第二个循环（缓存）中，您只有h。当然缓存的会更快。