jQuery 1.4.2 vs 1.8 (v6)

Revision 6 of this benchmark created on

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
</script>
<script>
  var $14 = jQuery.noConflict();
</script>
<script src="//code.jquery.com/jquery-1.8.2.min.js">
</script>
<script>
  var $18 = jQuery.noConflict();
</script>

<div id="id-outer">
  <div id="id-inner"></div>
  <div class="class-inner"></div>
</div>

<div id="test" class="test">
  <div id="child"></div>
</div>
<div class="test">
</div>
<div class="test">
</div>
<div class="test">
</div>
<div class="test">
</div>
<div class="test">
</div>
<div style="display:none;">
  <div id="page">
    <div id="masthead">
      <div id="mastheadhd">
      </div>
      <div id="mastheadbd">
        <div class="mastheadbd">
          <div id="eyebrow">
            <ul id="ypromo">
              <li>
                <a id="sethomepage" href=""><strong>Make Y! your home page</strong></a>
              </li>
              <li id="toolbar">
                <a id="dtba" href=""><span id="tba">Get</span> Yahoo! Toolbar</a>
              </li>
            </ul>
            <div id="ffhpcx">
            </div>
            <div id="headline">
              <span>
                <a href="">How much home can you afford?</a>
              </span>
            </div>
          </div>
          <h1>
            <img src="blank.gif" border=0 width=232 height=44 alt="Yahoo!" id="ylogo">
          </h1>
          <div id="searchwrapper">
            <form name="sf1" id="search" action="r/sx/*-http://search.yahoo.com/search">
              <fieldset>
                <legend>
                  Yahoo! Search
                </legend>
                <ul id="vsearchtabs">
                  <li class="first on">
                    <a href="">Web</a>
                  </li>
                  <li>
                    <a href="">Images</a>
                  </li>
                  <li>
                    <a href="">Video</a>
                  </li>
                  <li>
                    <a href="">Local</a>
                  </li>
                  <li>
                    <a href="">Shopping</a>
                  </li>
                  <li class="last ignore">
                    <dl id="vsearchm">
                      <dt>
                        <a id="vsearchmore" href="">More</a>
                      </dt>
                      <dd id="vslist">
                      </dd>
                    </dl>
                  </li>
                </ul>
                <div id="sbox">
                  <label id="searchlabel" for="p">
                    Search:
                  </label>
                  <div class="outer_search_container">
                    <div id="search_container" class="search_container">
                      <img src="blank.gif" id="searchother_e2e" alt="">
                      <div id="searchIE">
                        <div id="searchmw1" class="iemw">
                        </div>
                      </div>
                      <div class="fixfloat searchbox_container">
                        <div id="searchbox">
                          <input class="plong inputtext" type="text" id="p" name="p" accesskey="s">
                        </div>
                        <span id="searchbtn">
                          <input type="submit" id="searchsubmit" class="btn-more-2" value="Web Search">
                        </span>
                      </div>
                    </div>
                    <div id="e2eClass" class="e2e">
                      <div class="e2eTween">
                      </div>
                      <div id="e2e">
                        <div id="e2econtent">
                          <div id="e2e_intl">
                          </div>
                          <div class="ac_container">
                            <div id="e2einfo">
                            </div>
                            <div id="ac_container">
                            </div>
                            <div id="e2escroll">
                            </div>
                          </div>
                        </div>
                        <a title="toggle search suggestions" id="e2etoggle" href="" onclick="return false;"><img src="blank.gif" id="searchtoggle_e2e" alt="toggle search suggestions"></a>
                      </div>
                    </div>
                  </div>
                  <input type="hidden" name="fr" value="yfp">
                  <input type="hidden" name="toggle" value="1">
                  <input type="hidden" name="cop" value="mss">
                  <input type="hidden" name="ei" value="UTF-8">
                </div>
                <div id="sboxfooter">
                </div>
              </fieldset>
            </form>
          </div>
          <div class="mh_footer">
            <div id="doors">
              <h3 class="a11y">
                Popular Yahoo! Properties
              </h3>
              <ul id="doors-links" class="fixfloat">
                <li class="first">
                  <strong>
                    Yahoo! Home
                  </strong>
                </li>
                <li class="middle">
                  <a href=r/i1 title="Go to My Yahoo!">My Yahoo!</a>
                </li>
                <li class="last">
                </li>
              </ul>
            </div>
            <div id="pagesettingscx">
              <span id="navbardate">
                <cite class="timestamp">
                  &nbsp;
                </cite>
              </span>
              <a href="" id="editpage">Page Options</a>
              <div id="pagesettings">
                <div class="bd">
                  <span>
                    <div class="iemw">
                    </div>
                    <div id="pscolors">
                      <h4>
                        Color:
                      </h4>
                      <ol id="themes">
                        <li>
                          <a href="" id="t1" class="on" title="Ocean">Ocean</a>
                        </li>
                        <li>
                          <a href="" id="t4" title="Tangerine">Tangerine</a>
                        </li>
                        <li>
                          <a href="" id="t3" title="Violet">Violet</a>
                        </li>
                        <li>
                          <a href="" id="t2" title="Oyster">Oyster</a>
                        </li>
                        <li>
                          <a href="" id="t5" title="Grass">Grass</a>
                        </li>
                        <li>
                          <a href="" id="t7" title="Pink">Pink</a>
                        </li>
                      </ol>
                    </div>
                    <a id="sizetogglelink" href="">Switch to narrow layout</a>
                    <a id="myyahoolink" href="">Want more ways to customize <span>your home page?</span><span class="trymyyahoo">Try My Yahoo! &#187;</span></a>
                  </span>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div id="mastheadft">
      </div>
    </div>
    <div id="colcx">
      <div id="left">
        <div id="trough" class="md">
          <div class="bd">
            <div id="trough-cols" class="fixfloat">
              <ul id="trough-1" class="col1">
                <li>
                  <a style="background-position:-400px -120px" href="">Answers</a>
                </li>
                <li>
                  <a style="background-position:-400px -440px" href="">Autos</a>
                </li>
                <li>
                  <a style="background-position:0 -761px" href="">Finance</a>
                </li>
                <li>
                  <a style="background-position:0 -1600px" href="">Games</a>
                </li>
                <li>
                  <a style="background-position:0 -1400px" href="">Groups</a>
                </li>
                <li>
                  <a style="background-position:0 -439px" href="">HotJobs</a>
                </li>
                <li>
                  <a style="background-position:0 -600px" href="">Maps</a>
                </li>
                <li>
                  <a style="background-position:0 -161px" href="">Mobile Web</a>
                </li>
                <li>
                  <a style="background-position:0 -561px;display:inline" href="">Movies</a>
                  |
                  <a class="trough_tv" href="">TV</a>
                </li>
                <li>
                  <a style="background-position:0 -1562px" href="">Music</a>
                </li>
                <li>
                  <a style="background-position:-400px -1119px" href="">OMG</a>
                </li>
                <li class="highlight">
                  <a style="background-position:0 -40px" href="">Personals</a>
                </li>
                <li>
                  <a style="background-position:-400px -161px" href="">Real Estate<small class="updated"></small></a>
                </li>
                <li>
                  <a style="background-position:-400px -1321px" href="">Shine</a>
                </li>
                <li>
                  <a style="background-position:0 -1640px" href="">Shopping</a>
                </li>
                <li>
                  <a style="background-position:0 -800px" href="">Sports</a>
                </li>
                <li>
                  <a style="background-position:0 -79px" href="">Travel</a>
                </li>
                <li>
                  <a style="background-position:0 -121px" href="">Yellow Pages</a>
                </li>
              </ul>
            </div>
            <span id="allyservicescx">
              <a href="" id="allyservices" class="btn-more-2" title="View the complete list of Yahoo! Services">More Yahoo! Services</a>
            </span>
          </div>
        </div>
        <div class="md minimantle">
          <div id="smallbiz" class="md-sub">
            <div class="hd">
              <h2>
                <a href="">Small Business</a>
              </h2>

Setup

var $14outer = $14('#id-outer');
    var $18outer = $18('#id-outer');
    
    var $14test = $14('#test');
    var $18test = $18('#test');

Test runner

Ready to run.

Testing in
TestOps/sec
1.4.2 by id
//$14outer.find('#id-inner');
$14outer.find('.class-inner');
//$14('#id-inner');
//$14test.find('#child');
 
ready
1.8 by id
//$18inner.find('#id-inner');
$18outer.find('.class-inner');
//$18('#id-inner');
//$18test.find('#child');
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.