有哪些提高jQuery性能的快速提示？

Question

有哪些提高jQuery性能的快速提示？

Answer 1

1. 首先选择简单选择仅限ID ，然后仅选择标记名称。通过类名或CSS选择器选择需要jQuery来遍历DOM，而ID和标记映射到“本机”浏览器DOM函数（getElementById和getElementByTagName）。
2. 尽可能缓存您的jQuery对象。
3. 范围您对根jQuery对象的操作。不是单独选择元素，而是选择一个共同的祖先元素，并使用find函数查找元素子范围内的元素。如果你正在对共同的祖先进行一些操作，这真的是最佳的;否则，寻找祖先和缓存它的开销可能超过范围遍历的好处。
4. 请勿使用$.each()，使用for(;;)。它的速度提高了十倍以上。

Answer 2

保罗·爱尔兰最近在2009年jQuery大会上做了关于表演的演讲。这些幻灯片是我见过的最全面的幻灯片。

http://paulirish.com/perf/
http://www.slideshare.net/paul.irish/perfcompression

Answer 3

google's CDN上的参考文件，因此加载速度更快。

Answer 4

而不是：

$("#foo").addClass('test');
$("#foo").removeClass("bar");
$("#foo").slideUp('slow');

你可以这样做：

$("#foo").addClass('test').removeClass('bar').slideUp('slow');

Answer 5

它始终适用于常见的javascript：始终缓存，缓存，缓存 e.g：

var $this = $(this);
$this.css('width', parseInt($this.css('width')) + 20 + 'px');

Answer 6

实际上不可能提高jQuery的速度，它实际上取决于代码的效率，浏览器的JS解释器的效率以及运行代码的计算机的速度。您也许可以尝试重写jQuery以提高效率，但这需要时间，而且很可能已经非常优化。

Answer 7

确保效率的最佳方法之一是确保*选择器尽可能具体针对元素/类等。

* $（SELECTOR）

Answer 8

知道何时使用纯JavaScript而不是JQuery方法。

jQuery是JS + DOM的补充，不是它的完全替代品。您不必为您编写的每一行代码使用jQuery。有些东西没有它就更简洁地表达出来;没有它，很多事情都会更快。了解DOM提供的内容，这样您就不会最终编写我在此处发布的一些较为简单的示例。

例如：

var ix= $('#'+selectname).children().index($('#'+selectname+' option:selected'));

更快，更易于阅读，不会因ID中的意外字符而中断：

var ix= document.getElementById(selectname).selectedIndex;

Answer 9

我认为您要求进行代码优化，但由于性能高度依赖于使用的JavaScript-Engine，因此我想提及Google Chrome Frame。