not ([attr = "value"])와 [attr! = "value"] 사이에 성능 차이가 있습니까?

Question

:not([attr="value"]) 

및

[attr!="value"] 

사이의 성능 차이가 있나요? CSS3 사양은 다른 하나의 대안을 권장합니까?

는 편집 :

CSS3 스펙은 [attr!="value"] 선택기를 포함하지 않습니다. 이것은 jQuery가 구현하는 것입니다.

그래서, 질문은

$(':not([attr="value"])') 

및

$('[attr!="value"]') 

사이의 성능 차이가되어야 하는가?

Answer 1

jQuery는 네이티브 브라우저 기능을 사용하여 쿼리를 실행할 수 있으므로 가능한 경우 document.querySelector 또는 document.querySelectorAll을 사용하려고합니다.

뭔가가 사양에 없거나 브라우저에서 지원되지 않는 경우 jQuery는 Swizzle engine으로 폴백해야합니다. 일반적으로 DOM 자체를 트래버스해야하므로 느립니다.

try { 
    document.querySelectorAll(selector); 
} catch (e) { 
    Swizzle.querySelectorAll(selector); 
} 

따라서 브라우저 (잘 구현 된 경우) 빠른 [attr!="value"] 다음해야 :not([attr="value"])을 지원

코드 흐름이 (의사) 같은 것이다.

눈에 띄게되는지 여부는 유스 케이스에 따라 다릅니다.