JQuery常用功能的性能優化
使用最佳選擇器
通常比較常用的選擇器有以下幾個：
1.ID選擇器 $("#id")
2.標簽選擇器 $("td")
3.類選擇器 $(".target")
4.屬性選擇器 $("td[target='target']")
5.偽類選擇器 $("td:hidden")
結論
1.原生方法是最快的方法，如果可能，盡量選擇用原生
2.性能順序：ID選擇器 > 標簽選擇器 > 類選擇器 > 屬性選擇器 > 偽類選擇器
3.ID(getElementById)、標簽選擇器(getElementsByTagName)都有原生的方法對應，所以很快；類選擇器在除了IE5-IE8之外的主流瀏覽器幾乎都有原生方法(getElementsByClassName)，為了兼顧IE6、7、8的性能，避免使用全局的類選擇器；
4.屬性和偽類選擇器非常慢，如非必要，盡量少使用偽類選擇器和屬性選擇器
最佳實踐
1.為模塊中操作最頻繁的元素和根元素設置id，然后緩存；
2.對沒有id的元素檢索，盡量采用路徑最短的祖先元素id作為默認的搜索范圍，并采用純類選擇器或者標簽選擇器；
3.盡量避免復雜的選擇器
避免執行全局查找
$("div.bizHelp");
=>
$("#container").find(".bizHelp");
保證查詢的路徑最短，性能最優，參照第一條；
避免對空結果進行操作
對于數量為0的選擇結果，JQuery會執行默認動作，并且不會報錯，這會影響程序的性能。
var blank=$(".blank");//length=0
blank.slideUp();
=>
blank.length && blank.slideUp();
避免使用匿名函數
大量的使用匿名函數會對程序的調試、維護以及通過第三方軟件來做性能測試增加難度，因此應該盡量避免大量的使用匿名函數
obj.click(function(){
//do something...
})
=>>
var clickHandler=function(){
//do something...
}
obj.click(clickHandler)
大循環采用更高效的遍歷方式
JQuery提供了$.fn.each()和$.each()兩個方法來實現對集合的遍歷，除此之外，還可以采用JS原生的for循環、while等來實現迭代：
var list=ul.find("li"),e;
A:
var i=list.length;
while(i--){
e=$(list[i])
}
B:
list.each(function(){
e=$(this);
});
C:
$.each(list,function(){
e=$(this);
});
結論
總體上來說A>C>B
最佳實踐
追求極致性能，用原生方法；
循環數量少的話，建議使用$.each()，比較穩定；
優先使用原生屬性
很多常用的屬性，比如id、name等都被瀏覽器原生實現，在JQuery中我們有時會用$(this).attr("id")的方式來獲取id，這種方法的效率相比原生屬性的獲取效率而言，非常慢。
$.each(list,function(){
//A
var id=$(this).attr("id");
//B
var id=this.id;
})
結論
使用原生的API，可以極大的提高性能
最佳實踐
對于id等常用的屬性，用原生的屬性，不要通過attr去獲取；
使用事件委托
給一個列表中所有元素添加點擊事件，傳統的做法是得到這個列表的JQuery對象:$("li"),然后添加click事件：
$("li").click(function(){})
這種方法的在列表數量比較大的時候會有嚴重的性能問題，應該值得關注。
可以使用JQuery的事件委托機制，能很大程度的降低添加事件監聽的消耗和內存的消耗。
A:
var list=$("li");//length>1 list.click(function(){ })
B:
$("ul").delegate("li","click",function(){})
結論
委托的性能優勢是非常絕對的；
最佳實踐
對于需要同時給兩個以上的同類型元素添加事件時，用方案B來代替A
使用$.data 而不是$.fn.data
$(elem).data(key,value); $.data(elem,key,value);
后者比前者快近10倍
原文鏈接：http://andashu.blog.51cto.com/8673810/1375329