Question about cache in javascript/jquery

Question

I wonder if selector "$cacheA" will be cached on page load in the example below?

// MY JQUERY FUNCTION/PLUGIN
(function( $ ){
$.fn.myFunction = function() {

var $cacheA = this,
$cacheB = $cacheA.children(),
$cacheC = $cacheB.eq(0);
$cacheD = $cacheA.parent();    

$cacheD.click(function(){

$cacheA.toggle();
$cacheB.fadeIn();
$cacheC.slideUp();

});

};
})( jQuery );
// END JQUERY FUNCTION/PLUGIN



$(window).load(function(){

$('#mySelector').myFunction();

});

Would it be any reason to do this:

$(window).load(function(){

var $mySelector = $('#mySelector');

$mySelector.myFunction();

});

If $cacheA is cached I assume that $cacheB, $cacheC and $cacheD will also be cached at page load? — Hakan
– Hakan, Commented Apr 16, 2011 at 13:41
With "cache" I mean: By saving the selector in a variable the browser only have to do doom travel once. This will speed up the script if the selector is useed multiple times. — Hakan
– Hakan, Commented Apr 16, 2011 at 14:02

Pointy · Accepted Answer · 2011-04-16 14:28:03Z

2

If, inside your "load" handler, you were to do many jQuery operations with "$mySelector", then saving that in a variable would be a good idea. However, in your example, you only use the value once, so it really makes no difference at all.

answered Apr 16, 2011 at 14:28

Pointy

415k62 gold badges600 silver badges631 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Hakan Over a year ago

Thansk for your answer. The $mySelector will be used in the jquery function. See "var $cacheA = this". Will it make any difference then?

Andrew Whitaker Over a year ago

+1 Caching is only valuable when you're traversing the DOM over and over again with the same selector.

Pointy Over a year ago

No - if you save the $('#something') value, then you can re-use it many times. Inside your jQuery plugin "myFunction", it will be the value of this. However, the variables "$cacheB", "$cacheC", and so on, are all local variables, and they will be re-computed every time you call "myFunction", even if you call it with the same starting jQuery object ("$mySelector").

buryat · Accepted Answer · 2011-04-16 15:01:27Z

0

Firstable, $cacheA and others inside click function will be undefined.

$cacheD.click(function(){

$cacheA.toggle();
$cacheB.fadeIn();
$cacheC.slideUp();

});

Second,

$.fn.myFunction = function() {

var $cacheA = this,
$cacheB = $cacheA.children(),
$cacheC = $cacheB.eq(0);
$cacheD = $cacheA.parent();
}

So, after $('selector').myFunction() how can I use $cacheB, $cacheC and $cacheD? Where they are will store?

answered Apr 16, 2011 at 15:01

buryat

3843 silver badges8 bronze badges

Collectives™ on Stack Overflow

Question about cache in javascript/jquery

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related