first vs first (v2)

Revision 2 of this benchmark created by Jethro Larson on


Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<ul>
  <li>list item 1</li>
  <li>list item 2</li>
  <li>list item 3</li>
  <li>list item 4</li>
  <li>list item 5</li>
</ul>

<div>
    <a href="#">first</a>
    <a href="#">second</a>
    <a href="#">third</a>
    <a href="#">fourth</a>
</div>
<script>
  (function( jQuery ) {
      
      var oldFirst = jQuery.fn.first;
      
      jQuery.fn.first = function( selector ) {
          if ( selector ) {
              return this.find( selector ).eq(0);
          }
          
          return oldFirst.apply( this, arguments );
      };
      
      jQuery.fn.f2rst = function( selector ) {
          if ( selector ) {
              return this.find( selector+":first" );
          }
          
          return oldFirst.apply( this, arguments );
      };
      jQuery.fn.f3rst = function( selector ) {
          if ( selector ) {
              return $(document.querySelector( this.selector +" "+selector ));
          }
          
          return oldFirst.apply( this, arguments );
      };
      
  })( jQuery );
  
  
  var $div = $("div");
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
eq(0)
$div.first("a").length === 1;
ready
a:first
$div.f2rst("a").length === 1;
ready
querySelector
$div.f3rst("a").length === 1;
ready

Revisions

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

  • Revision 2: published by Jethro Larson on