问为什么jQuery选择器函数比本机DOM方法慢

EN

这是当我们使用一个简单的选择器$(‘’)时jquery所经历的代码量

http://james.padolsey.com/jquery/#v=1.10.2&fn=init

正如你所看到的，有大量的验证，正则表达式匹配，跨浏览器技巧等。

重要的是要认识到，jquery是一个构建在javascript.Javascript上的库，它直接在browser.Where上执行，因为jquery在浏览器执行之前会处理相当多的javascript代码。

我个人更喜欢jquery，我真的不担心保存jquery提供的那些纳米seconds.The级别的简单性，这本身就是一件艺术品。

没有什么比原生javascript更快的了，这是有原因的: jQuery努力使你的代码跨浏览器兼容并且易于使用。它在大多数方法调用的基础上构建一个jQuery对象。在这一点上，jQuery将比所需的最小数据路径慢得多，因为它希望提供随时可用的功能。

让我们比较一下这两个“相似”的调用：

在比JavaScript更低的级别执行简单查找操作的document.getElementById("box")：本机方法。然后，它返回已经加载到内存中的DOM元素。这是最快的方法之一。

$('#box')：在这里，jQuery将从解析你要求它做的事情开始。例如，它将验证它是否是格式良好的选择器，然后尝试识别它是哪种类型的选择器。一旦完成验证，它将尝试获取ID为"box“的元素。然后，他将创建一个新的jQuery对象，用每个预期的属性填充该对象，并确保所有浏览器(以及较旧的浏览器)都获得相同的结果。这包括大量的回退和合规性测试。当对象准备就绪时，您将获得ID为"box“的元素。不像getElementById()那么简单。当目标元素上不需要jQuery特性时，许多人更喜欢使用getElementById('box')而不是$('#box')。

更新- 15/02/17:

随着jQuery >= 2.0不再支持臭名昭著的IE 6/7/8，一些兼容性测试就不再需要了，这使得jQuery变得更轻更快。如果您不需要支持较旧的浏览器，则可以使用jQuery >= 2.0而不是1.x来提高整体性能。

我为jQuery.fn.init(document.getElementById('id'))添加了另一个测试用例，它比大多数其他方法更快，因为它既不解析字符串，也不创建新的jQuery对象(它比getElementById、jsperf落后大约50% )，而且当我看到在jQuery.fn.init调用期间执行的jquery代码的源代码时：

function (selector, context, rootjQuery){
  if (selector.nodeType) {
          this.context = this[0] = selector;
          this.length = 1;
          return this;
  }
}

我只能得出结论，Chrome和Firefox工程师在优化原生DOM操作方面做得非常好。