使用 JavaScript 时,速度和性能绝对不是小问题。在现实中,创建 jQuery 的开发人员和处理浏览器内置 JavaScript 引擎的开发人员都非常关注性能问题。事实上,在最近 6 个月以来,浏览器开发的最重要问题就是 JavaScript 引擎的速度。浏览器开发者都致力于在下一年迅速提升 JavaScript 的执行性能,从而大大提高 jQuery 代码和 JavaScript 引擎的速度。来自这些 “速度之战” 的消息表明,提升 JavaScript 性能是大势所趋。领导 jQuery 项目的 John Resig 一直都在谈论他的最新 “Sizzle” 选择引擎。他从头编写了一个选择引擎,并声称初步结果表明它比 Firefox 要快 4 倍。这是巨大的速度提升!在我撰写本文的最后部分时,jQuery 1.3 已经发布,并且包含了 Sizzle 选择引擎。jQuery 声称,在所有浏览器上运行的总体结果表明选择引擎的 1.3 版本比 1.2.6 版本的快 49%。此外,1.3 发布版在 HTML 注入(向 DOM 添加新的元素)上改进了 6 倍,在函数定位上改进了 3 倍。在我完成本文时,很多人都更新到了最新的 jQuery 发布版,这是非常令人激动的!
影响 JavaScript 性能的另一个因素是浏览器,如前所述,它的影响是所选的库的 9 倍。Firefox 和 Chrome 在 “最快 JavaScript 引擎” 之战中各有胜负,而 Safari 的参与让竞争更加激烈。从我们上面的测试中,可以看到 Chrome 在 JavaScript 引擎性能方面远远超过 Firefox,但是 Firefox 3.1 将包含新的 Tracemonkey JavaScript 引擎,届时其速度将比当前的 JavaScript 引擎 3.0 快 20 至 40 倍(这是他们声称的,不是我的观点),真不可思议!
在未来一两年内,您将看到底层 JavaScript 引擎和 JavaScript 库的速度得到巨大改进,从而导致使用 JavaScript 的 Web 应用程序将变得更加复杂。
如果您正在决定是使用 JavaScript 库还是自己编写 JavaScript,那么需要考虑的另一件事情是处理和调试 JavaScript 库所需的全部工作。最近几年以来,有数百位用户一直在维护库中的每一个函数。您可能要忙到深夜,甚至筋疲力尽地编写自己的函数。您更相信谁呢?另外,即使您能编写出比 jQuery 库更快的代码,您是否想过使用 jQuery 库能够获得更多的优势?您是否为了辛苦地编写自己的代码而放弃使用非常便利的 jQuery 及其函数库?自己编写代码不仅需要大量时间,并且还会产生更多 bug,因此我还是建议使用现成的 jQuery 库。
我最后讨论的要点可能会让一些人沮丧,但是我们必须考虑编写这些 jQuery 库的程序员。他们当中的一些是最棒的,并且他们编写的超级优秀的代码(一般人不能编写这样出色的代码)都收入到这些库中。我承认自己远远不如编写 jQuery 库的程序员。因此,为何不利用他们的智慧?
结束语本文从总体上讨论了 jQuery 和 JavaScript 库的性能。通过对选择方法进行大量的测试,您看到这些库之间的速度存在巨大的差距,并且 jQuery 是最快的库之一。不过,即使您选择了最快的 JavaScript 库,还是不能解决 Web 应用程序的性能问题,因为浏览器对性能的影响比库强 9 倍。如果您能够控制用户使用特定的 Web 浏览器,那么就让他们使用最快的浏览器。找到能够最快地运行您的 Web 应用程序的浏览器,并让用户通过使用它从中受益。理想情况下,让最慢的 JavaScript 浏览器消失意味着出现更快的 Web 应用程序。
我还提供了关于 jQuery 性能的 3 个技巧。尽管有好几个站点都提供了关于 jQuery 性能的技巧,但是这 3 个技巧是最有效的。3 个技巧肯定比 50 个技巧容易记住,但其他技巧也是很好的,我将在 部分指出另外一些技巧。不过,如果您在编写代码时记住了这 3 个技巧,将会获得巨大的性能提升。应该永远记住的 3 个 jQuery 技巧是:通过 ID 搜索比通过 CLASS 搜索快 100 倍,尽可能多地提供搜索信息,以及尽量缓存选择。
最后,我们快速查看了 jQuery 和浏览器的 JavaScript 引擎即将推出的改进。在我撰写本文的结尾部分时,jQuery 1.3 已经发布了,它承诺在选择和代码的其他方面实现跳跃式性能改进。此外,Firefox 还承诺它的下一代 JavaScript 引擎会快 20 至 40 倍!这些迹象表明,在未来的一两年内,JavaScript 环境会在性能上取得重大突破。在不久的将来,复杂的 Web 应用程序会日益流行,因为快速运行这些程序的条件已经成熟。
在本文结束时,我们应该回过头来重新检验这句话 “jQuery 在简单的页面上无可挑剔,但在复杂的页面上性能极其低下。在解决性能问题之前,您必须对复杂页面使用常规的 JavaScript。”根据我的经验,jQuery 的 “性能问题” 一样出现在 “常规的 JavaScript” 中。事实上,真正影响性能的不是 jQuery 或 JavaScript,而是浏览器。因此我同意这样的观点:使用设计不良的 jQuery 代码的复杂页面运行在 IE6 上时会导致糟糕的性能。不过,我希望您已经了解我要阐述的思想:只要拥有良好的 jQuery 代码、运用 3 个最重要的技巧并选择最快的浏览器,那么即使运行最复杂的页面也不会出现明显的性能问题。