0

网上有太多关于 JQuery 选择器的信息,以至于我对 JQuery 选择器性能的当前最新技术感到困惑。

  • JQuery 是否仍在评估选择器 RTL?

不管怎样,...

  • ('#context').find('.inner') still faster than ('#context .inner')
  • ('li') still faster than ('.classOnAllAndOnlyOnLiElements')

我知道我可以编写自己的 JSPerf 性能评估,但是,我担心我将使用的那种 DOM 树不适合这样的测试(因为我不是专业人士,因此不知道我需要做什么生成,例如 # DOM 树级别、# DOM 树元素等)

希望有人可以从理论的角度回答我的问题,并通过对 JQuery 实现的更多了解,而不是通过简单的性能评估,这可能只是对一个特定 DOM 树的答案。

4

2 回答 2

0

这里重要的部分是,对于简单的选择器,并且您的选择器很简单,jquery 使用 *MatchesSelector或者document.querySelectorAll如果它可用并且它显然依赖于浏览器。因此,唯一知道的方法是在您将要使用的所有浏览器中对其进行分析。

来自 jquery 源:

 ....
 matches = docElem.webkitMatchesSelector ||
    docElem.mozMatchesSelector ||
    docElem.oMatchesSelector ||
    docElem.msMatchesSelector,
 ....
 jQuery.extend({
find: function( selector, context, results, seed ) {
    ...
    if ( seed ) {
        while ( (elem = seed[i++]) ) {
            if ( jQuery.find.matchesSelector(elem, selector) ) {
                results.push( elem );
            }
        }
    } else {
        jQuery.merge( results, context.querySelectorAll(selector) );
    }

    return results;
}
   ....
 })
 ...
 jQuery.extend( jQuery.find, {
matches: function( expr, elements ) {
    return jQuery.find( expr, null, null, elements );
},
matchesSelector: function( elem, expr ) {
    return matches.call( elem, expr );
},
attr: function( elem, name ) {
    return elem.getAttribute( name );
}
 });
于 2013-10-10T12:14:03.873 回答
0

jsPerf与任何可以回答您问题的人的回答一样具有理论性。

我们只能告诉你 jQuery 是如何编写的,但如果不对你的 DOM 进行测试,它是没有用的——就像 jsPerf...

但是,我仍然会使用 jsPerf 并在多个浏览器中对一些小型 DOM 进行抽象测试,因此您知道如何最好地对应用程序进行编码,而不管其大小如何——这对于任何Web 开发来说都是一个通用的想法。

一般来说,编码不应与 DOM 的大小相关联,而应与产品的性能相关联——这就是 jsPerf 之类的工具可以提供很大帮助的地方

;-)

于 2013-10-10T12:11:44.787 回答