jQuery 인스턴스 객체를 참조했을 때와 참조하지 않을 때의 성능차이

$() 팩토리 함수의 참조 vs 비참조

$() 에서 반환되는 인스턴스 객체(jQuery 객체) 를 참조했을 경우와 참조하지 않고 사용했을 경우의 성능 차이를 콘솔 타임으로 보도록 하겠습니다.

jQuery 인스턴스 객체를 참조하지 않은 경우

console.time('Non Cached');
var i = 0;
for(; i < 10000; i++) {
    var $test = $('div');
}
console.timeEnd('Non Cached');

jQuery 인스턴스 객체를 참조한 경우

console.time('Cached');
var i = 0,
        $test = $('div');

for(; i < 10000; i++) {
    var s = $test;
}
console.timeEnd('Cached');

콘솔창에서 확인해 보면 시간차이를 알 수 있습니다.

제이쿼리를 어떻게 사용하느냐에 따라서 성능, 최적화에 큰 차이가 있습니다.

제이쿼리가 DOM 을 편리하게 다룰 수 있도록 제공해 주지만 만능은 아닙니다. 

사용자들도 제이쿼리를 생각없이 사용하지는 말아야 할 것 같습니다.