[jQuery] Re: Performance Tuning Help

[besh]

Hi Raymond,

I'm not sure if this is less cpu intensive, but at least it's more
jQuery:

$('div.box').each(function() {
  var $snippet = $(this).find('dd p').html();
  $(this).append('div class=summaryp class=sml' + $snippet +
'/p/div');
});

--
Bohdan Ganicky

On Jan 24, 12:01 am, Raymond [EMAIL PROTECTED]
wrote:
 I was wondering if anyone knows of a less processor intensive way of
 doing the following code?

 I am trying to loop over all classes of a certain type on the page and
 then append some html that is contained within that particular class.
 What it is doing to the user is collapsing the search results into a
 summary of each as the length of the original result set can be long
 to scroll through.

 var count = 0;
 $('div.box').each(function()
 {
 $('div.box:eq(' + count + ')').append('div 
 class=summaryp
 class=sml' + $('div.box:eq(' + count + ') dd p').html() + '/p/
 div');
 count = count + 1;
 });

[jQuery] Re: Performance Tuning Help

[Shawn]

The other suggestions are good starting points.  One comment though...

doing $(div.box) needs to examine EVERY div on your page to see if it 
has the .box class.  If you can constrain that search some that could 
help improve performance.  For instance, if you only care about the 
div's in a particular area you might do $(div.box, #myarea) - and 
exclude all div's outside that area.

The other suggestions touch on this, but doing the $(div.box:eq(...)) 
inside your loop is forcing yet another search of all the divs with the 
.box class.  You can replace that entire bit (and the count variable) 
with this).  $(this).append(. . .);  Within an EACH loop, this is a 
reference to the currently matched element.

So the routine becomes
$(div.box).each(function () {
   $(this).append(
 div class=\summary\p class=\sml\ +
 $(dd p, this).html() +
 /p/div);
});

//(the $(this).append() line is really one line - split for readablity)

One rule of thumb I've learned - where ever possible, use a unique ID. 
Doing a selector based on ID is S much faster than a class based 
selector.  Of course this isn't always possible though...

HTH

Shawn

Raymond wrote:
 I was wondering if anyone knows of a less processor intensive way of
 doing the following code?
 
 I am trying to loop over all classes of a certain type on the page and
 then append some html that is contained within that particular class.
 What it is doing to the user is collapsing the search results into a
 summary of each as the length of the original result set can be long
 to scroll through.
 
 var count = 0;
   $('div.box').each(function()
   {
   $('div.box:eq(' + count + ')').append('div 
 class=summaryp
 class=sml' + $('div.box:eq(' + count + ') dd p').html() + '/p/
 div');
   count = count + 1;
   });

[jQuery] Re: Performance Tuning Help

[Karl Swedberg]

On Jan 23, 2008, at 11:58 PM, Joel Birch wrote:



Or this (untested):

$('div.box').each(function(){
var $$ = $(this);
$$.append('div class=summaryp class=sml' + $$.find('dd
p').html() + '/p/div');
});

Joel Birch


This looks good. I wonder if a tiny bit of performance could be  
squeezed out of changing the string concatenation to an array join  
(still untested):


$('div.box').each(function(){
var $$ = $(this);
$$.append(['div class=summaryp class=sml',
$$.find('dd p').html(),
'/p/div'].join('')
);
});

Would be interesting to see string vs. array approach tested somewhere.

--Karl
_
Karl Swedberg
www.englishrules.com
www.learningjquery.com

[jQuery] Re: Performance Tuning Help

[Raymond]

Thanks to everyone for the suggestions. All were faster than the
original but I went with Joel's as it seems to be the quickest. Thanks
again!

[jQuery] Re: Performance Tuning Help

[Aaron Heimlich]

Try this (untested):
$('div.box').each(function(count, box) {
$(box).append('div class=summaryp class=sml' + $('dd p',
box).html() + '/p/div');
});

On Jan 23, 2008 5:01 PM, Raymond [EMAIL PROTECTED]
wrote:


 I was wondering if anyone knows of a less processor intensive way of
 doing the following code?

 I am trying to loop over all classes of a certain type on the page and
 then append some html that is contained within that particular class.
 What it is doing to the user is collapsing the search results into a
 summary of each as the length of the original result set can be long
 to scroll through.

 var count = 0;
$('div.box').each(function()
{
$('div.box:eq(' + count + ')').append('div
 class=summaryp
 class=sml' + $('div.box:eq(' + count + ') dd p').html() + '/p/
 div');
count = count + 1;
});




-- 
Aaron Heimlich
Web Developer
[EMAIL PROTECTED]
http://aheimlich.freepgs.com

[jQuery] Re: Performance Tuning Help

[Joel Birch]

Or this (untested):

$('div.box').each(function(){
var $$ = $(this);
$$.append('div class=summaryp class=sml' + $$.find('dd
p').html() + '/p/div');
});

Joel Birch