使用 ":not" 和 ".not()" 选择器之间的性能差异？答案

【问题标题】：Performance differences between using ":not" and ".not()" selectors?使用 ":not" 和 ".not()" 选择器之间的性能差异？
【发布时间】：2012-02-09 09:00:44
【问题描述】：

以下两行之间是否存在任何速度/效率差异。

$("table td:not(:first-child)")

和

$("table td").not(":first-child")

我认为第一个会更好，因为它会删除对象，但是是否存在实际差异并且是否很大。

谢谢

【问题讨论】：

jsperf.com/jquery-css3-not-vs-not
这可能是我的更多问题，我不确定如何准确测量它。我会假设较小的页面没有问题，但它在什么时候会有所不同？
在可读性方面存在明显的差异。您的申请中是否存在其他类型的差异？
我同意我真的很喜欢可读性，但我想确保我不会因为可读性而失去显着的性能。
我发现第二个更容易阅读，所以如果我发现特定页面上的性能问题，我会从这种方式开始并重新审视它。

标签： jquery jquery-selectors css-selectors

【解决方案1】：

取决于浏览器。

支持querySelectorAll 的浏览器将获得性能提升...

$("table td:not(:first-child)")

...因为它是一个有效的选择器。旧版浏览器（IE7 及更低版本） 不会。

您需要小心:not() 选择器。 jQuery (Sizzle) 使用非标准选择器对其进行了扩展，因此很容易破坏 qSA。

【讨论】：

【解决方案2】：

从jsperf 测试中可以看出，:not 的平均速度大约是两倍。总体而言，尽管此性能可能只占您整体执行时间的一小部分。

jquery 文档状态：

.not() 方法最终将为您提供更具可读性选择而不是将复杂的选择器或变量推入 :not() 选择器过滤器。在大多数情况下，这是一个更好的选择。

因此，您实际上可以决定您获得的几分之一秒是否超过可读性。

【讨论】：

另外，可读性也有点个人化。我真的对 :not 的可读性没有问题。特别是与我看到的程序员所做的其他事情相比，可读性要差得多。
我在上面的 jsperf 链接中收到“内部服务器错误”。也许是different revision？