如何提高我的网站 IE6/7 JS 性能？答案

【问题标题】：How can I improve my sites IE6/7 JS performance?如何提高我的网站 IE6/7 JS 性能？
【发布时间】：2010-01-23 01:04:18
【问题描述】：

所以我最近参与了一次网站重写，我们已经在各个方面都对以前的网站进行了重大改进（不，这并不完美，我们按时完成并且一直在改进 :D），但有一个例外：在 IE6/7 中，它会在页面显示后锁定。我知道这是 JS，因为它被禁用它很快，我知道一些事情，比如我们使用的 simplegallery 插件非常慢，但即使这样并且谷歌广告被删除，它仍然处于爬行状态（+8 秒）。我查看了 Firebug 分析器并进行了大量 JS/CSS 更改，例如：

将除我们的 img 错误处理之外的所有 JS 移至页面底部
改进所有指定的 jQuery 选择器以获得最佳性能
迁移到 jQuery 1.4
通过 JS Lint 运行我们的核心自定义 JS (main.js)
Split 常用图像
降低 CSS 选择器的复杂性

这样做对所有浏览器都有好处，我知道我可以做得更多，但我没有看到我需要的 IE6/7 的重大改进。我们确实将 DD_roundies_0.0.2a.js 用于 IE7，但不用于 IE6。我尝试了 DynaTrace，但看不到任何明显的东西，尽管我确实有点迷失了它的深度。

A sample listing page

A sample search page

谁能看到我在这里可能遗漏的内容和/或指出一些好的 IE 分析工具？

编辑：我应该提到我已经使用过 YSlow、PageSpeed 和 Chrome 的开发者工具。所有这些都是我过去提到的大部分改进的基础。在这一点上，我并不是说该站点已完全优化，但没关系并且朝着正确的方向前进。但是我在 IE6/7 中有一个问题，我认为是 JS 执行。

编辑 2：我们已经从服务器发送了 IE6 的 Chrome Frame 元标记。这不是一个解决方案，但我认为它对 IE6 利大于弊。在这一点上，我正在关注 JS 特定的反馈，因为我认为我已经涵盖了所有其他基础。

【问题讨论】：

你应该只在你的代码验证后才使用 XHTML；目前，您在两个文档中都有 60 多个错误；如果有人真的将其解析为 XHTML 而不是标签汤，他将得到的只是一条错误消息！

标签： javascript jquery performance internet-explorer

【解决方案1】：

您可以在 IE6 中手动配置您的“common.js”脚本。只需在战略位置获取新的时间戳并在最后提醒他们。

例如

function ts() { return (new Date).getTime(); }
var t0 = ts();
// some of your code
var t1 = ts();
// rest of your code
var t2 = t();
alert(t1-t0); // milliseconds between t0 and t1
alert(t2-t0); // ms between t0 and t2

也许脚本的一部分比其他部分慢得多。
或者也许它只是 IE6。

【讨论】：

【解决方案2】：

您包含来自http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.js 的 jquery，如果您将其托管在您的网站上，下载速度会更快。

此外，请查看 Firebug 的 YSlow 插件，它为您提供了大量信息，说明您可以采取哪些措施来缩短网站的加载时间。

【讨论】：

感谢您的意见。经历了很多 YSlow 和 Page Speed（上面会提到）。至于 jQuery，我更喜欢它在 google 上，因为它更有可能为用户缓存。另外我不确定下载速度是不是我认为更多的是 JS 执行的问题。
使用 ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.js（1.4.0 而不是 1.4）会稍微快一些，因为它可以被客户端缓存，但是您必须更新新的 1.4.* 版本的 url。
谢谢金布尔。但是您认为该网址有什么问题？当我检查标题时，它是 Cache-Control: public, must-revalidate, proxy-revalidate, max-age=3600 并在 12 天后过期。我错过了什么吗？
“如果您将其托管在您的网站上，它会下载得更快” - 最好跨域传播内容 - 现代浏览器一次下载的内容不会超过几个。 stackoverflow.com/questions/561046/…

【解决方案3】：

如果你想强制你的用户安装谷歌浏览器框架，它会让 IE 使用 chrome 渲染器和 javascript 引擎

http://code.google.com/chrome/chromeframe/

【讨论】：

整个 Chrome Frame 毫无意义。只需让用户使用 Chrome（或任何其他体面的网络浏览器）。
Chrome Frame 绝对不是 Corportes 和落后的 IT 管理员的解决方案（不要粗鲁，但 IT 人员仍然想要 IE6，他一定是个白痴或太懒了，对吧？）不会允许的。这就是说我们已经有条件地将它发送下来对于 IE6！
抱歉，这 99% 是个玩笑。我觉得你作为我公司最大的客户只使用 IE6。你唯一能做的就是优化优化优化，因为 IE6 的 javascript 引擎很弱。如果您需要删除昂贵的功能，请执行此操作并告诉他们原因。此外，使用 chromes 分析器来告诉您是否经常调用您的任何函数，这对我来说最有效。
你可以使用IE6的一些可用漏洞并自己安装chromeframe。或者向那些管理员建议安装方法...

【解决方案4】：

目前似乎唯一可疑的是“omniture.js”。

这是我发现的一篇关于 omniture.js and IE6 的博文。

您可以在 Chrome 上使用SpeedTracer 来调试速度问题。当然js速度要根据V8引擎来。

【讨论】：

【解决方案5】：

javascript 本身通常不是问题，当您修改 DOM 时会遇到麻烦，例如动画、添加和删除元素。对不透明度要格外小心。

【讨论】：

【解决方案6】：

看看LABjs & RequireJS: Loading JavaScript Resources the Fun Way，它讨论了如何并行加载脚本。

直到最新一代浏览器，标签有一些真的很不利的表现它的特点。即，标签“block”，意思是他们停止其他一切在页面上加载/发生，而他们加载并在执行时。不是他们只会停止所有其他部分页面，他们甚至用来停止加载任何其他标签。

【讨论】：