jQueryのCSS セレクタは書き方次第でスピードがかなり変わってしまうようです。

普段自分が使っている書き方として以下の2つがあるのですが、

$('#contents p'); //1
$('#contents').find('p'); //2

1より2の方が早いとの事。

というのも、セレクタは【右から左】に解釈される為、$(“#contents ｐ”)の様な記述だと全てのp要素を検索して、その中で#contentsが親要素にあたるp要素をjQueryオブジェクトとする、かなり無駄のある動作。

findを使う場合、#contentsの中を検索してからｐ要素をjQueryオブジェクトとする無駄のない動作になるそう。

1の書き方でも#contentsの中を検索してからｐ要素をjQueryオブジェクトとしてくれると思っていました…

最近、仕事でもjQueryを書く事が多くなってきたので、もう一度パフォーマンスチューニングの面も含めて勉強し直したいです。。。