Learning jQuery 3 - Fifth Edition

Improving performance with caching

Caching is simply storing the result of an operation so that it can be used multiple times without running the operation again. In the context of selector and traversal performance, we can cache a jQuery object in a constant for later use rather than creating a new one.

Returning to our example, we can rewrite the stripe() function to avoid selector duplication with caching rather than chaining:

$(() => {   const $news = $('#news');  function stripe() {    $news      .find('tr.alt')      .removeClass('alt');    $news      .find('tbody')      .each((i, element) => {        $(element)          .children(':visible')          .has('td')          .filter(':group(3)')          .addClass('alt');      });  }  stripe();}); 

Listing 9.16

The two operations are separate JavaScript statements ...