Android原生浏览器中的dom处理时间太长

Too high dom processing time in Android native browsers

本文关键字：处理 时间 dom 原生 浏览器 Android      更新时间：2023-09-26

我目前正在努力减少网站的前端加载时间。我遵循了各种步骤，如延迟加载javascript、使用sprite、组合&缩小css/js文件。我已经看到主要浏览器的页面加载时间大大减少了。然而，我可以看到，所有与android相关的原生浏览器的DOM处理时间都在6-7秒左右，从而将页面加载时间提高到9秒，与其他浏览器加载时间（约5秒）相比，这太高了。

我知道上面提供的信息没有代码，而且非常模糊。有人能为我指明减少Android原生浏览器中DOM处理时间的正确方向吗？

前段时间，我做了很多IE6优化。我学到的是使用尽可能具体的选择器。假设您有一个巨大的DOM树，并尝试使用jQuery:选择find_me类的三个节点

...
<div class="find_me">...</div>
<div class="find_me">...</div>
<div class="find_me">...</div>
...

$('.find_me')会返回所有的类名称，但浏览器必须检查整个DOM树中是否有这个类名。

让我们总结一下：

...
<div id="unique_wrapper">
  <div class="find_me">...</div>
  <div class="find_me">...</div>
  <div class="find_me">...</div>
</div>
...

$('#unique_wrapper .find_me')也会返回它们，但速度要快得多，因为浏览器几乎会立即选择id为unique_wrapper的元素，而忽略DOM树的其余部分。

我真的不知道与旧的IE6相比，Android浏览器在多大程度上优化了这种行为。但我敢打赌，如果你优化你的选择器，你可以加快一点速度——假设你根本使用选择器。

相关文章：