더 빠르고 그 이유는 무엇입니까? div (플러그인 요구 사항)를 $('div[data-something]') 또는 $('div.something')으로 선택 하시겠습니까? 나는 "청소기"이기 때문에 전자를 향하여 몸을 기울입니다.jQuery 성능 - data-attr 또는 클래스별로 선택 하시겠습니까?
this SO question을 기반으로 나는 둘 다 사용하면 안된다는 것을 알고 있습니다. 그러나 나는 이것들 사이에 차이점이 있는지 없는지 알지 못했다.
브라우저마다 다를 수 있습니다. 거의 모든 브라우저가 이제 querySelectorAll을 지원하며 가능한 경우 jQuery가이를 사용합니다. querySelectorAll은 속성 존재 선택자와 함께 사용할 수 있으므로 jQuery가 작업을 수행 할 필요가 없다면 엔진에 오프로드 할 수 있습니다.
querySelectorAll이없는 구형 브라우저의 경우 jQuery는 분명 더 많은 작업을 수행해야하지만 IE8도 있습니다. 이러한 것들의 대부분과 마찬가지로
은 가장 좋은 건입니다
당신은 문제가있는 경우 당신은 문제가, 그리고
를 참조하지 않는 한, 프로파일/때까지 그것에 대해 걱정하지 마십시오
jQuery가 브라우저에서 지원하는 경우 먼저 getElementByCalssName을 사용하려고하기 때문에 클래스별로 선택하는 것이 항상 속성 선택 자보다 빠릅니다. 그렇지 않은 경우 CSS 선택기를 사용하여 페이지 내의 요소를 찾는 querySelector을 사용합니다.
아니요, jQuery는'getElementsByClassName'보다는 거의 모든 브라우저에서'querySelectorAll'을 사용할 것입니다. 그것은 단순한 클래스 선택자 ('div.test'와 같이 결합되지 않은)를위한'getElementsByClassName'으로 돌아갈 것이지만, 현대의 어떤 것에서도 브라우저 자체의 CSS 구현을 연기 할 수 있습니다. –
왜 downvote ?? – ShankarSangoli
나에게 가혹한 것 같지만, 아마도 div.something이 항상 빠를 것이라고 말했기 때문일 것입니다. –
Chrome 16 이상, there is no difference. 적은 특정 클래스 선택 (예를 들어 $(".test"))을 할 경우, 그것은 다른 방법을 능가 수행합니다 ShankarSangoli 언급으로하기 때문에, 나는 div.test 클래스 선택이 될 것이라고 생각 다소 예상치 못한
빠릅니다.
IE9에서 비슷한 결과를 보였습니다.'div.something'은'div [data-something]'보다 약간 빠르지 만 둘 다'.something '보다 훨씬 느립니다. –
@ T.J.Crowder - IE9에서 실행하여 몇 분만 절약 해 주셔서 감사합니다 :) Firefox는 다시 똑같습니다. 해당 결과를 포함하도록 스크린 샷을 업데이트했습니다. –
''.test''는 Sizzle이'querySelectorAll' 대신'getElementsByClassName'을 사용하여 DOM 선택을 최적화 할 수 있도록합니다. 대부분의 브라우저에서 전자는 현재 더 빠릅니다. 그러나'div.test '는'gEBCN'도'qSA'도 지원하지 않는 IE6이나 IE7 같은 브라우저에서는 수동 클래스 테스트를'div' 요소로만 좁히기 때문에 빠를 것입니다. –
좋은 질문 ... 누군가가 $ ('*')을 시도해 볼 수 있습니까? :) 항상 그것이하는 일이나 수행이 무엇인지 알고 싶었습니다. – ggzone