왜 jQuery 객체를 캐시합니까?

그래서 jQuery 객체를 캐시해야하는 이유는 무엇입니까? 다음과 같은 시나리오에서왜 jQuery 객체를 캐시합니까?

var foo = $('#bar'); 
foo.attr('style','cool'); 
foo.attr('width','123');

$('#bar').attr('style','cool'); $('#bar').attr('width','123');

왜 첫 번째 옵션은 훨씬 더 두 번째 옵션보다?

성능 때문이라면 어떻게 사용률을 줄일 수 있습니까?

출처

2014-05-19 ThePixelPony

'$ ('# bar')'를 여러 번 사용하면 첫 번째가 더 좋다고 생각합니다. 예제에서는 한 번만 사용했습니다. 그래서 이점이 없어야합니다. –

@KingKing, oops, 나는 두 가지 행동을 포함하도록 그것을 편집했다. – ThePixelPony

Google은 친구입니다 - https://www.google.com/search?q=cache+jquery+selectors – mplungjan

jQuery 함수는 많은 코드를 가지고 있기 때문에 같은 출력을 기대하는 동일한 입력으로 두 번 이상 실행하면 불필요한 오버 헤드가 발생합니다. 결과를 캐싱하면 찾고자하는 요소의 정확한 요소 또는 요소 집합에 대한 참조를 저장하므로 전체 DOM을 다시 검색 할 필요가 없습니다 (매우 빠른 검색 임에도 불구하고). 대부분의 경우 (소량의 코드가있는 간단한 페이지) 차이점을 알 수는 없지만 수행 할 경우 큰 차이가 발생할 수 있습니다.

이 작업은 testing your example in jsPerf으로 볼 수 있습니다.

또한이 질문은 가독성을 위해 Introduce Explaining Variable 리팩터링 패턴의 예라고 생각할 수 있습니다. 특히 질문에있는 것보다 복잡한 예를들 수 있습니다.

출처

2014-05-19 17:10:08 David

많은 답변. 그런 세부 사항. 매우 받아들입니다. 감사! – ThePixelPony

jQuery 선택기 $('#foo')은 DOM 전체에서 일치하는 요소를 검색 한 다음 결과를 반환합니다.

이러한 결과를 캐시하면 jQuery가 선택기를 사용할 때마다 DOM을 검색 할 필요가 없다는 것을 의미합니다.

EDIT : document.getElementById()은 jQuery가 DOM을 검색하는 데 사용하지만 jQuery가 충분하지 않습니다.

출처

2014-05-19 17:08:12 ThePixelPony

답변의 정신은 정확하지만 ID 선택기의 특정 인스턴스에서 jQuery는 ['document.getElementById()'] (https://developer.mozilla.org/en-US)를 사용하고 있습니다. /docs/Web/API/document.getElementById) –

@JasonSperske 감사합니다. 나는 내 대답을 바로 잡으려고 노력할 것이다. – ThePixelPony

왜 jQuery 객체를 캐시합니까?

답변

관련 문제