WP gallery nav test 2

Benchmark created on


Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div class="wp-volt-gal-nav-items">
                                <div class="wp-volt-gal-nav-button selected" data-index="1">1</div>
                                <div class="wp-volt-gal-nav-button" data-index="2">2</div>
                                <div class="wp-volt-gal-nav-button" data-index="3">3</div>
                                <div class="wp-volt-gal-nav-button wp-volt-gal-nav-item-section" data-index="4t"></div>
                                <div class="wp-volt-gal-nav-button" data-index="4">4</div>
                                <div class="wp-volt-gal-nav-button" data-index="5">5</div>
                                <div class="wp-volt-gal-nav-button" data-index="6">6</div>
                                <div class="wp-volt-gal-nav-button" data-index="7">7</div>
                                <div class="wp-volt-gal-nav-button" data-index="8">8</div>
                                <div class="wp-volt-gal-nav-button" data-index="9">9</div>
                                <div class="wp-volt-gal-nav-button" data-index="10">10</div>
                        </div>

Setup

var itemsEl = $('.wp-volt-gal-nav-items');
    var itemEls = itemsEl.children();
    itemEls.removeClass('selected');
    
    var state = {
      currentPhoto: '4t',
      sectionIndex: 1
    };
    
    function isPhoto() {
      return this.attr('data-index') == state.currentPhoto;
    }

Test runner

Ready to run.

Testing in
TestOps/sec
Finding using .eq()
var photoIndex = parseInt(state.currentPhoto);
if (state.currentPhoto.indexOf('t') != -1) {
  itemEls.eq(photoIndex + state.sectionCount - 1).addClass('selected');
} else {
  el = itemEls.eq(photoIndex + state.sectionCount).addClass('selected');
}
ready
Filter using selector
itemEls.filter('[data-index=' + state.currentPhoto).addClass('selected');
ready
Filter using function
itemEls.filter(isPhoto).addClass('selected');
ready

Revisions

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